CSS(层叠样式表) HTML表达结构,css表达样式 样式和内容是分离的
3种方式加入CSS
<!DOCTYPE=html>
<html>
<head>
<title> </title>
<meta charset=utf-8>
<style>
p {background-coclr: gray;}
</style>
</head>
<body>
<p>
</p>
<p style=”background-color:yellow;”>
</p>
</body>
</html>
<!DOCTYPE=html>
<html>
<head>
<title> 1 </title>
<meta charset=utf-8>
<style>
p {background-coclr: gray;}
</style>
</head>
<body style=”background-color:gray”>
<p>1111111
</p>
<p style=”background-color:yellow;”>1111111
</p>
</body>
</html>
定义颜色 RGB #
style=”background-color:rgba(0,255,0,0.5)”这样可以选择透明度
style=”background-color-image:url(hands520.jpg)
background-repeat:no-repeat;不重复
background-position:center” 、top right、100px 100px 位置
background-attachment:scroo”跟着文字滚动默认,
不默认background-attachment:fixed”
<p style=”background:”
文本的颜色
<p style=”coloe:red”> </p>
文字第一行缩进 <p style=”text-indent: 2em”>
一个em就是一个字宽负数时可以斜挂缩进 还可以缩进百分比
还有in cm厘米mm毫米px像素点 pt磅
行的高度
<p style=”text-ident:2em;line-height:2em”> 把2em改成normal就是正常的
<p style=”text-indent:2em;text-align:center”>靠中间对齐 justify两端对齐
加word-spacing:30px单词和单词有30个像素点的距离对英文有用
word-spacing:10px;letter-spacing:10px 字符之间的间距
text-transform:uppercase”>所有的字母都变成大写
lowercase都变成小写 capitalize 首字母要大写
text-decoration:underline overline line-through”>文字上画线
white-space:normal”> white-space:normal:pre”>你有回车的地方就有回车
white-space:pre-wrap “>
字体
<p style=”text-indent:2em;
font-family:serif sans-serif monospace cursive fatasy ”>
font-style:italic;斜体font-variant:small-caps;大写
font-weight:bold” 加粗 bold可以改为数字
font-size:0.5em”> 大小 可以px ,建议用em
阴影
text-shadow:3px 5px 5px rgba (0,255,0,0.5)”
<h1 style=text-shadoe:0px -1px 0px #000000,
0xp 1px 3px #606060; color:#606060;
otline-color:red;outline-style:solid:
outline-width:1”>
</h1>