CSS：层叠样式表
HTML用来写出网页内容，CSS则用来找到HTML写出的东西，改变样式；
HTML写出的内容都是默认样式，字体种类、颜色、大小，图片宽高、边框等，CSS用来美化其外观，性能。
选择修改内容->选择器
标签选择器：
标签名 {
属性:值;
属性:值;
......
}id选择器 #id名{.....}
class选择器 .class名{......}
通配符选择器 *{.......} 选择所有标签
CSS样式的三种写法：
内部样式表：将style标签写在head标签里：
<head>
...
<style>
css代码
</style>
...
</head>外部样式表：把CSS代码写在一个文件里，需要的时候用link导入
<head>
...
<link rel="stylesheet" herf="css文件路径">
...
</head>这样可以让网页源代码更整洁，并且一个CSS文件可供多个网页使用。
行内样式表：CSS代码写在标签内，如：
<p style='color:red; text-align:center; '>123</p>文本样式
1.color : 颜色
color: blue;
color: #096;
color: rgb(130,200,50)
颜色有三种写法:
1.直接写预设好的颜色单词：red、 green 、pink、 gold
2.用十六进制颜色： #096 原谅绿、#6cf 天依蓝
3.用rgb值设置颜色： rgb(255,255,255)、rgb(0,0,0)、rgb(70,70,70)
2.font-size: 字的大小 (px像素 em字符单位)
font-size: 70px;
3.font-family: 设置字体(宋体/微软雅黑)
font-family:'Microsoft YaHei' ; (微软雅黑)
font-family:'微软雅黑';（中文也行）
4.font-weight: 字的粗细 100-1000
font-weight: 1000;
5.font-style: 字的样式(倾斜)
font-style: italic;
6.text-indent: 文字缩进
text-indent: 2em;（缩进两个默认字符大小）
7.text-align: 设置文本对齐
text-align: center;(left:左 center:中 right:右)
8.text-decoration: 设置文本样式(下划线)
text-decoration: uderline; 下划线
overline; 上划线
line-through; 删除线
none; 无
9.line-height: 设置文本的上下位置(行高)
line-height: 30px;
背景样式：
1.background-color : 设置背景颜色
background-color: #096; // 设置方式和color一样
2.background-image : 设置背景图片
background-image: url(图片路径)；
3.background-position: 设置背景位置
left左 center中 right右 top上 bootom下
0 0 --> 默认左上
4.background-size : 设置背景大小
background-size: cover; // 缩放
5.background-repeat: 设置背景图片是否重复
background-repeat: no-repeat;
扫一扫
268
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
