使用方法:
<img src="" width= height= alt=>
src指定要加载的图片的名称和地址;
width指定图片的宽度 值px 或者百分比
heigh指定图片的高度
border指定图片的边框
alt,网页上的图片,当鼠标移动到上面则显示文字。
图片加载失败则会用文字来代替
搜索引擎可以通过这个属性来抓取图像
<img>不用闭合
a为超链接
href=""地址
target打开方式属性有_blank,_parent,_top,_self(默认)
name 设置锚点,
<a href="#dibu"></a>
<a name="dibu"></a>
设置图片超链接;
<a href="http://www.baidu.com" target="_blank"><img src="地址"></a>
table
属性的应用:
caption设置表格的标题
tr设置行
td和th设置列
其中行和列以及table中还可以设置的属性包括:
bgcolor,align,valign(center,right,left),width.heigth,rowspan和colspan.
table的属性,cellspacing 单元格之间的间距,默认为2px cellpadding单元格内容与单元格边框的显示距离,像素
frame控制表格边框最外层的四条边框(void宝石无边框,above表示仅顶部有边框,below表示仅底部有边框,hsides表示仅有顶部的边框和底部的边框,lhs表示仅有左边的边框,rhs表示仅有右边的边框,vsides表示仅有左右的边框,box包括全部四个边框,border表示包括全部四个边框,)
rules控制显示以及如何显示单元格之间的分割线:
(none默认值,all表示包括所有分割线,rows表示仅有行分割线,clos表示仅有列分割线,groups表示仅在行组和列组之间有分割线)
简单表格布局:
代码:
<html>
<head>
<title>table布局</title><!--网页标题-->
<meta charset="utf-8"><!--设置编码格式-->
</head>
<body topmargin="0"><!--页面顶部空间为0-->
<table border="0" align="center" width="900" cellspacing="0" cellpadding="0"><!--整个table的表框,
位置居中,宽度,以及各个单元格的距离-->
<tr bgcolor="red" height="100" align="center"><td><font color="white" size="6"><b>页面顶部布局</b></font></td></tr>
<!--每行的样式,背景色,字体位置等-->
<tr align="center"><td>
<table align="left" bgcolor="yellow" width="30%" height="300">
<tr align="center">
<td >
<font color="white" size="6"><b>页面左部布局</b></font>
</td>
</tr>
</table>
<table align="left" bgcolor="purple" width="70%" height="300">
<tr align="center">
<td >
<font color="white" size="6"><b>页面右部布局</b></font>
</td>
</tr>
</table>
</td>
<!--内嵌的table要设置tr的td里面-->
</tr>
<tr bgcolor="red" height="100" align="center"><td><font color="white" size="6"><b>页面底部布局</b></font></td></tr>
</table>
</body>
</html>