图像是网页构成中最重要的元素之一,美观的图像会为网站增添生命力,同时也可以加深用户对网站风格的印象。
标签属性
使用HTML制作网页时,如果想让HTML标签提供更多的信息,可以使用HTML标签的属性加以设置。其基本语法格式如下:
<标签名 属性1="属性值1" 属性2="属性值2" …> 内容 </标签名>
在上面的语法中,
1.标签可以拥有多个属性,必须写在开始标签中,位于标签名后面。
2.属性之间不分先后顺序,标签名与属性、属性与属性之间均以空格分开。
3.任何标签的属性都有默认值,省略该属性则取默认值。
采取键值对——key="value" 的格式
比如: <hr width="400" /> 表示:设置 属性:宽度 、值:400
图像标签img
HTML网页中任何元素的实现都要依靠HTML标签,要想在网页中显示图像就需要使用图像标签<img>。
其基本语法格式如下:
<img src="图像URL" />
img标签的几个常用属性:
<!--举个栗子-->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Doument</title>
</head>
<body>
基本图像插入方式<br />
<img src="img/logo.png"/><br />
alt属性<br />
<img src="img/logo1.png" alt="这是我的小logo!"/><br />
title属性<br />
<img src="img/logo.png" title="我是一个logo~~"/><br />
width/height属性<br />
<img src="img/logo.png" width="300"/><br />
border属性 <br />
<img src="img/logo.png" border="10"/><br />
</body>
</html>
注意:
- src属性用于指定图像文件的路径和文件名,他是img标签的必备属性。
- URL指存储图像的位置,可以是本地计算机上的图片地址,也可以是互联网上图片的地址。
- 一般情况下由于图片会自动等比缩放,强行设置宽高会使页面失真,因此通常,宽和高设置一个就够了。