Css常用语法手册
background-image:url("mmm.jpg") 背景图(默认会从左到右 从上到下的重复覆盖背景)
background-repeat:no-repeat (不重复)
background-repeat: repeat-x , repeat-y (左右覆盖 上下覆盖)
background-position:right top; bottom 控制背景图的位置
文本
text-decoration:none 删除下划线
text-decoration:underline 增加下划线
color:颜色
letter-spacing:字符间距
word-spacing:字间距
line-height:行高
text-align:文本位置
text-index:50px; 首字母缩进50px
direction: ltr rtl (左到右 右到左)
text-shadow:15px 20px #f00; X方向移动20px Y方向-20px
字体 font
font-size: 字体大小
font-family:字体类型
font-style:italic(斜体) 字体样式
font-weight:100-900 字体粗细 500是正常
Css链接:
a:link :正常没点过
a:visited:用户已经访问过
a:hover:用户鼠标放在连接上
a:active:被点击的那一刻
ul列表样式表:
ul.a{list-style-type:none} 取出列表的默认
ul{list-style-image:url("ddd.jpg");}列表头号图标
list-style-position:inside(里面) outside(外面) 图标放的位置
表格:
table{border-collaspse:collaspse} 把表格双线改成一个线
盒子模型:
margin border padding content
边框border:
solid (实线) dashed(虚线) dotted(点线)
轮廓outline:
text{
outline-style:solid; dashed 轮廓的样式
outline-color:#f55; 轮廓的颜色
outline-width:5px; 轮廓的厚度
}
margin-top margin-bottom margin-right margin-left
padding-top padding-bottom ~~’
CSS尺寸:
height 元素的高度
line-height:设置行高
max-height:元素的最大高度
max-width:元素的最大宽度
min-height:元素的最小高度
min-width:元素的最小宽度
width:元素的宽度
display:
p{display:none} 隐藏元素
p{display:inline} 修改块状元素为内联元素
span{display:block} 修改内联元素为块状元素
定位 position
static :默认HTML元素 相当于没有定位
fixed:固定在一个位置
relative:相对定位元素的定位是相对其正常位置 (以元素的默认位置为参考。进行定位)
absolute:绝对定位的元素位置相对于最新的已定位父元素,如果元素没有已地位的父元素,则定位html
浮动:float
//这个要重新学
特别是clear :left right both
CSS组合选择器:
div p 后代选择器(可以是N层)
div>p 子元素选择器(只能是子层。 孙层就不行了)
div o 相邻兄弟选择器(紧挨着的第一个元素-只能在后面。)
div~p 后续兄弟选择器:(元素之后,相邻的兄弟元素, 也就是在同一层)
伪类元素:
p:after{content="这里是内容"} 可以追加内容
p:before{content=”也是内存“} 在p之前追加
p:first-child :匹配第一个p元素
p:laster-child:匹配最后一个p元素
CSS3.0
border-radius:10px;圆角
box-shadow:10px 20px 5px #8888 :x方向 Y方向(向下) 高斯模糊度(数字越大越模糊) 颜色
text-shadow:10px 5px 5px 同理
background:linear-gradient(to right, red,blue);
从左到右。 红到蓝
cursor:crosshhair; //鼠标样式
评论