一、css简介
css，层叠样式表(英文全称：Cascading Style Sheets),用于修饰html
二、css选择器
1、id选择器：利用标签id属性进行匹配
#id值{样式设置}
2、class选择器：利用标签的class属性进匹配
.class值{样式设置}
3、标签选择器
标签类型{样式设置}
4、层级选择器
.c1 .c2 div{}
5、组合选择器
.c1,.c2,div{}
6、属性选择器(对选择的标签再次通过属性进行筛选)
.c1[n=‘chen‘]{}
注：样式使用的优先级：标签上的style优先，然后根据表秀尔顺序，越靠近标签越优先
可在头部直接通过 <link rel="stylesheet" href="css文件"> 将css文件引用
三、常见css属性
color : #999999; /*文字颜色*/
font-size : 9pt; /*文字大小*/
font-style:itelic; /*文字斜体*/
line-height : 200%; /*设置行高*/ （居中常用）
font-weight:bold; /*文字粗体*/
text-align:center; /*文字中间对齐*/ （居中常用）
padding-top:10px; /*上边框留空白*/
padding-right:10px; /*右边框留空白*/
padding-bottom:10px; /*下边框留空白*/
padding-left:10px; /*左边框留空白
background-image : url(/image/bg.gif); /*背景图片*/
background-repeat : repeat; /*重复排列-网页默认*/
background-repeat : no-repeat; /*不重复排列*/
background-repeat : repeat-x; /*在x轴重复排列*/
background-repeat : repeat-y; /*在y轴重复排列*/
指定背景位置
background-position : 90% 90%; /*背景图片x与y轴的位置*/
background-position : top; /*向上对齐*/
background-position : buttom; /*向下对齐*/
background-position : left; /*向左对齐*/
background-position : right; /*向右对齐*/
background-position : center; /*居中对齐*
a:active /*按下链接的格式*/
a:hover /*鼠标转到链接*/
border-top : 1px solid #6699cc; /*上框线*/
border-bottom : 1px solid #6699cc; /*下框线*/
border-left : 1px solid #6699cc; /*左框线*/
border-right : 1px solid #6699cc; /*右框线*/
border-top-color : #369 /*设置上框线top颜色*/
border-top-width :1px /*设置上框线top宽度*/
border-top-style : solid/*设置上框线top样式*/
solid /*实线框*/
dotted /*虚线框*/
double /*双线框*/
groove /*立体内凸框*/
ridge /*立体浮雕框*/
inset /*凹框*/
outset /*凸框*/
margin-top:10px; /*上边界*/
margin-right:10px; /*右边界值*/
margin-bottom:10px; /*下边界值*/
margin-left:10px; /*左边界值*/
position：relative|absolute|fixed 定位
opacity：透明度级别
z-index:层级顺序
display：none|inline|block|inline-block 显示与否以及块级和行内标签转换
float ：right|left 让标签飘起来
原文地址：https://www.cnblogs.com/chenxiaozan/p/12683335.html