Web图形样式基础2

图片链接

1.为创建图片链接，只需在<img>标记两边加上锚标记。例如：

<a href="index.html"><img src="home.gif" alt="Home" height="20" width="85" border="0"></a>

  其中border="0"属性，用于取消默认在图片周围显示的一圈蓝色边框。

2.若主导航区包含多媒体内容，为无障碍访问导航内容，应在页脚区域配置一组纯文本导航链接。

配置背景图片

1.同时配置背景颜色和背景图片，首先显示背景颜色，然后显示背景图片。例如：

body{ background-color:#99cccc;
      background-image:url(bg.jpg); }

2.浏览器的默认行为是重复(平铺)背景图片，使之充满容器元素整个背景。使用background-repeat属性来更改这种平铺行为。

   使用background-position属性指定背景图片的位置（默认左上角）。

属性名称	说明	值
background-color	元素的背景颜色	任何有效颜色值
background-image	元素的背景图片	url圆括号里指定图片文件名或路径
background-position	背景图片的位置	两个百分比、像素值或位置值(left,right,top,bottom,center)。第一个值设置水平位置，第二个值设置垂直位置，默认居中。
background-repeat	控制背景图片在元素内的重复方式	repeat(默认)，repeat-y(垂直重复)，repeat-x(水平重复)，no-repeat(不重复)
background-attachment	配置是否允许背景图片在网页中滚动	fixed,scroll(默认)

3.在组织网站时，将所有图片放在与网页文件不同的文件夹中是一种很好的做法。

CSS3多张背景图片

1.CSS3中多张背景图片用background属性配置，每个图片声明都以逗号分隔。background属性采用速记表示法，只列出和background-position,background-repeat等属性对应的值。

2.渐进式增强：从基本功能开始，逐渐增强用户体验。先确保大多数浏览器能很好地显示，再添加新技术。

收藏图标

1.收藏图标为地址栏或网页标签上的小图标，大小为16*16像素或32*32像素。

2.使用<link>标记将收藏图标与网页关联。例如：

<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">

其中，rel属性值是icon，href属性值是图标文件名，type属性值是文件的MIME类型。

注意，第二个link标记是为保持IE的兼容，并遵循Microsoft特有的语法。