文本阴影
text-shadow: x轴的偏移量 y轴的偏移量 模糊距离 阴影颜色(x正方向向右,y正方向向下)
text-shadow: 10px 10px 10px black;
( -webkit-浏览器类型前缀)
文字的描边
text-stroke:文本描边的宽度 颜色*/
背景颜色
background-color: red;
背景图片
(优先级高于背景颜色)(url:地址)
background-image: url("../../img/f3_Android1.png");
背景图片的遍历方式
no-repeat:不重复
repeat-x:只在x轴方向遍历(x轴方向重复)
repeat-y:只在y方向遍历(y轴方向重复)
background-size:背景图片的大小
contain:图片的宽高比例不变,直到较小的方向填满,才停止缩放(图片永远不会溢出)
cover:图片的宽高比例不变,直到较大的方向填满,才停止缩放(图片基本上都会溢出)
固定的大小:x轴的宽度 y轴的高度
百分比大小(用的较多):x轴的宽度百分比 y轴高度的百分比
雪碧图
很多小的图形在同一个图片上,用到哪个位置就移动哪个
background-position: -82px 0px;
列表
(列表样式,none取消)
list-style: none;
(浮动,让列表横向显示,left左对齐)
float: left;
超链接的状态
<style>
/*顺序不能乱 LVHA*/
Link链接
a:link{
color: black;
}
Visited浏览以后
a:visited{
color: darkgrey;
}
Hover设置当鼠标悬停时的样式
a:hover{
color: yellow;
}
Active按下鼠标的样式
a:active{
color: red;
}
</style>
图片链接
<a href="http://www.baidu.com">
<img src="../../img/f3_Android1.png" alt="">
</a>
title属性:当鼠标悬浮在元素上方时,显示title属性