学习周记3

CSS链接

链接样式
链接的样式，可以用任何CSS属性（如颜色，字体，背景等）。
特别的链接，可以有不同的样式，这取决于他们是什么状态。
这四个链接状态是：
a:link - 正常，未访问过的链接
a:visited - 用户已访问过的链接
a:hover - 当用户鼠标放在链接上时
a:active - 链接被点击的那一刻

常见的链接样式

文本修饰

text-decoration 属性主要用于删除链接中的下划线：
实例

a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:underline;}
a:active {text-decoration:underline;}

当设置为若干链路状态的样式，也有一些顺序规则：
a:hover 必须跟在 a:link 和 a:visited后面
a:active 必须跟在 a:hover后面

背景颜色

背景颜色属性指定链接背景色：
实例

a:link {background-color:#B2FF99;}
a:visited {background-color:#FFFF85;}
a:hover {background-color:#FF704D;}
a:active {background-color:#FF704D;}

CSS margin(外边距)

margin 清除周围的（外边框）元素区域。margin 没有背景颜色，是完全透明的。
margin 可以单独改变元素的上，下，左，右边距，也可以一次改变所有的属性。

Margin - 单边外边距属性

在CSS中，它可以指定不同的侧面不同的边距：

margin-top:100px;
margin-bottom:100px;
margin-right:50px;
margin-left:50px;

Margin - 简写属性

margin:
四个值为 上/右/下/左
三个值为 上/左右/下
两个值 上下/左右

CSS Float(浮动)

往往用于图像
元素的水平方向浮动，意味着元素只能左右移动而不能上下移动。
一个浮动元素会尽量向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。
浮动元素之后的元素将围绕它。
浮动元素之前的元素将不会受到影响。

.thumbnail 
{
	float:left;
	width:110px;
	height:90px;
	margin:5px;
}

CSS 图像透明/不透明

img
{
	opacity:0.4;
	filter:alpha(opacity=40); /* 适用 IE8 及其更早版本 */
}
img:hover
{
	opacity:1.0;
	filter:alpha(opacity=100); /* 适用 IE8 及其更早版本 */
}

一个悬停使照片清晰的效果：