1.CSS概念
css：cascading style sheets，层叠式样式表。规定了html标签在网页上的现实样式
2.CSS作用
样式：html标签在页面的显示效果
某一标签有什么样式，直接设置其属性即可。具体来说，一个是结构样式，一个是显示样式
3.CSS的几个小属性
1.文本样式
字体，颜色，大小
-
font-family：复合属性，字体类型，包括英文和中文字体。书写时，英文在前，中文在后，可以多写几个，当前边找不到是，会从后边的选择。中文字体写成其对应的英文写法，会加快加载速度。
-
font-size：复合属性，文字大小，单位为像素（px）
-
font-weight：复合属性，文字粗细
-
color：文字颜色，rgb，rgba，十六进制。red，blue等
h2 { font-family: "微软雅黑","宋体"; font-size: 30px; font-weight: bold; color: red; }
2.容器基本属性
-
width： 宽，单位为像素（px)，不写单位不起作用。
-
height：高，同上。
-
background-color：背景色。
-
border：复合属性，有多个值，用空格隔开。边框的宽度，类型，颜色
p { font-family: "Arial"; font-size:20; font-weight: normal; color: blue; width:500px; height: 200px; border: 1px solid green; background: lightgray; }
效果图
4.CSS的书写位置
根据书写css的位置的不同，将我们的样式表分为三种：行内式，内嵌式，外链式。
-
行内式：css属性写在标签的一个style属性里。
<div style="font-size: 30px; font-weight: bold; color: red; width:100px; height: 40px; border: 1px solid green; background: lightgray;"> 行内式 </div> -
内嵌式：写在html文件里，head标签内的，style标签内：属性type：text/css表示内部写的是纯文本类型的css样式代码
<html> <head> <style type="text/css"> h2 { font-family: "微软雅黑","宋体"; font-size: 30px; font-weight: bold; color: red; } </style> </head> </html> -
外链式：将css单独写在一个css文件里，然后使用时链接到html文件中即可，以后详细介绍
注意：常用内嵌式和外链式，行内式一般留给后端添加。
5.CSS的注意事项
- html的属性和属性值，键值对 ：k="v";
- css的属性和属性值，键值对：k:v;
- 多属性之间用分号分割，空格换行不影响
- 自己书写代码时，要进行合理的换行和压缩
- 上传到网上时，为了提高加载速度，需要将所有的空格，缩进，换行等删除，压缩代码。网上有在线工具。
网友评论