HTML基础学习四

来源：互联网发布：零基础云计算视频教程编辑：程序博客网时间：2024/05/16 17:48

HTML 图像

替换文本属相alt

在浏览器无法载入图像的时候，会显示alt设置的内容，一般鼠标放在图像上也会显示文本。

创建图像映射

<html><body><p>请点击图像上的星球，把它们放大。</p><imgsrc="/i/eg_planets.jpg"border="0" usemap="#planetmap"alt="Planets" /><map name="planetmap" id="planetmap"><areashape="circle"coords="180,139,14"href ="/example/html/venus.html"target ="_blank"alt="Venus" /><areashape="circle"coords="129,161,10"href ="/example/html/mercur.html"target ="_blank"alt="Mercury" /><areashape="rect"coords="0,0,110,260"href ="/example/html/sun.html"target ="_blank"alt="Sun" /><area shap="rect"coords="160 0 211 74"href="https://www.baidu.com"target="_blank"alt="black"></map><p><b>注释：</b>img 元素中的 "usemap" 属性引用 map 元素中的 "id" 或 "name" 属性（根据浏览器），所以我们同时向 map 元素添加了 "id" 和 "name" 属性。</p></body></html>

带有可供点击区域的图像地图。其中的每个区域都是一个超级链接。

图像标签

标签描述<img>定义图像。<map>定义图像地图。<area>定义图像地图中的可点击区域。

HTML 表格

表格标签

表格描述<table>定义表格<caption>定义表格标题。<th>定义表格的表头。<tr>定义表格的行。<td>定义表格单元。<thead>定义表格的页眉。<tbody>定义表格的主体。<tfoot>定义表格的页脚。<col>定义用于表格列的属性。<colgroup>定义表格列的组。

简单的举一个例子：

<html><body><table width="400" border="1"> <tr>  <th align="left">消费项目....</th>  <th align="right">一月</th>  <th align="right">二月</th> </tr> <tr>  <td align="left">衣服</td>  <td align="right">$241.10</td>  <td align="right">$50.20</td> </tr> <tr>  <td align="left">化妆品</td>  <td align="right">$30.00</td>  <td align="right">$44.45</td> </tr> <tr>  <td align="left">食物</td>  <td align="right">$730.40</td>  <td align="right">$650.00</td> </tr> <tr>  <th align="left">总计</th>  <th align="right">$1001.50</th>  <th align="right">$744.65</th> </tr></table></body></html>

如图：

HTML列表

列表标签

标签描述<ol>定义有序列表。<ul>定义无序列表。<li>定义列表项。<dl>定义定义列表。<dt>定义定义项目。<dd>定义定义的描述。<dir>已废弃。使用 <ul> 代替它。<menu>已废弃。使用 <ul> 代替它。

无序列表：

<html><body><ul style="disc"><li>hym</li><li>eric</li><ol style="aquare"><li>eric</li><li>hym</li></ol></ul><body><html>

着重自定义列表

自定义列表不仅仅是一列项目，而是项目及其注释的组合。
自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。

<html><body><h2>一个定义列表：</h2><dl>   <dt>计算机</dt>   <dd>用来计算的仪器 ... ...</dd>   <dt>显示器</dt>   <dd>以视觉方式显示信息的装置 ... ...</dd></dl></body></html>

阅读全文

0 0