样式表

样式表

分类

　　内联 写在标签里面　　　　控制精确，代码重用性差

　　　　style="样式"   

　　内嵌 嵌在页面的head里面　　控制没有内联精确，代码重用性好

　　　　<style type="text/css"></style>    

　　外部 单独的样式文件　　控制没有内联精确，代码重用性最好

　　　　引入：右键-CSS样式表-附加样式表    

　　　　引入：<link href="004css.css" rel="stylesheet" type="text/css" />

选择器

　　样式表用来选取元素的

　　标签选择器

　　　　根据标签名选中元素

　　class .(点)

　　　　根据class名来筛选元素

　　id #（井号）

　　　　根据id名来筛选出唯一元素

　　复合选择器

　　　　逗号并列  div,span

　　　　空格后代 #list li

　　　　点筛选 div.s

样式

　　大小

　　　　width 宽度

　　　　height 高度

　　背景

　　　　background-color 背景色

　　　　background-image 背景图

　　　　background-repeat 背景图的平铺方式

　　　　background-position 背景图标的位置

　　　　background-attachment 设置背景图片是否滚动

　　　　background-size 背景图的大小 200px 200px

　　字体

　　　　font-family 字体样式

　　　　font-size 字体大小 常用12px 14px

　　　　font-style italic 倾斜

　　　　font-weight 字体粗细 bold加粗

　　　　text-decoration　　　　下划线 underline　　上划线 overline　　删除线 line-through none没有，用来去掉超链接的下划线

　　　　color 字体颜色

　　对齐方式

　　　　text-align 水平对齐方式

　　　　vertical-align 垂直对齐方式，配合行高使用

　　　　line-height 行高

　　　　text-indent 缩进 像素

　　边界边框

　　　　margin 外边距 上右下左

　　　　padding 内边距 上右下左

　　　　border 简写方式 粗细 方式 颜色 1px solid #452

　　列表方块

　　　　list-style 将列表前面的序号去掉none

　　　　list-style-image 可以将前面的序号变为图片可以将前面的序号变为图片

转载于:https://www.cnblogs.com/The-second/p/5856809.html