HTML超文本一

最新推荐文章于 2022-10-23 08:55:23 发布

BANDGAP

最新推荐文章于 2022-10-23 08:55:23 发布

阅读量665

点赞数 1

分类专栏： HTML学习

本文链接：https://blog.csdn.net/BANDGAP/article/details/82314884

版权

HTML学习专栏收录该内容

4 篇文章 0 订阅

订阅专栏

一、链接
1、给文本添加超链接

<body>
    <p>
        <a href="http://www.shiyanlou.com">shiyanlou</a>
    </p>
</body>

2、给图片添加超链接

<body>
    <p>
        <a href="http://shiyanlou.com"><img src="tubiao.png"/></a>
    </p>
</body>

3、超链接的打开方式
通过属性target来控制。
a.自我覆盖
（即在本页打开） <a href="http://shiyanlou.com" target="_self"shiyanlou</a>
b.打开新窗口 <a href="http://shiyanlou.com" target="_blank">shiyanlou</a>
4、给超链接添加提示文字
通过属性title来控制

<a href="http://www.shiyanlou.com" title="this will lead you to a new world">shiyanlou</a>

5、超链接实现书签
锚：用于在单个页面内不同地方的跳转。

<a href="#跳转目的地名称">跳转起始字符</a>
...
...
<a name="跳转目的地名称">跳转目的地字符</a>

二、HTML表格
表格由标签<table> 来定义。
行数定义：<tr>
单元格定义：<td> 单元格内容可包含文本、图片、段落、表单、水平线、表格等。
表头定义：<th>
例：

<table align="center" border="1">//border定义最外边边框的粗细
    <tr>
    <td>first row and first column</td>
    <td>first row and second column</td>
    </tr>
    <tr>
    <td>second row and first column</td>
    <td>second row and second column</td>
    </tr>
</table>

控制此单位所占列数：colspan
控制此单位所占行数：rowspan
这里写图片描述
三、HTML图像
设置图片为网页背景图片：<body background="./qwe.gif">
插入图片：<img src="路径➕文件名"
图片的对齐方式（相对字符）：

<img src="./qwe.gif" align="top">//
<img src="./qwe.gif" align="middle">//
<img src="./qww.gif" align="bottom">//
<img src="./qwe.gif" align="left">//
<img src="./qwe.gif" align="right">//

改变图片大小，在img标签中添加属性：width\height
四、创建图像映射
例：

<html>
    <body>
        <img src="./julizi.png" usemap="#lizi" />
        <map name="lizi">
            <area shape="rect" coords="50,10,100,60" href="img.html" target="_blank">
        </map>
    </body>
</html>