样式表
分类
内联 写在标签里面 控制精确,代码重用性差
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 可以将前面的序号变为图片可以将前面的序号变为图片