HTML中网页超链接设计

时间：2023-03-09 03:16:43
HTML中网页超链接设计

一、超链接的概念：

1>用<a>标签实现。href属性设置了要链接的网址。

链接路径URL：Uniform Resource Locator的缩写。统一资源定位符。

4部分组成：协议名、主机名、文件夹名、文件名。

相对URL通常只包含文件夹名和文件名。绝对URL包含全部信息。

2>设置链接的目标窗口。target属性，定义链接打开的目标窗口或框架，定义新的窗口。

target属性的属性值及其功能：

target属性值及功能
_blank　　　　 将链接的文档载入到一个新的未命名的浏览器窗口
_parent 将链接的文档载入包含该链接框架的父框架集或窗口。
_self 将链接的文档载入链接所在的同一框架或窗口，通常不需要设置
_top 将链接的文档载入整个浏览器窗口，而删除所有的框架
   

3>设置链接的提示信息，使用<a>标签的title属性。

4>链接网站内部的不同网页。将href设置成要链接的网页名称。

5>使用锚链接到同一个网页的不同位置。添加的锚点：id必须唯一

<a id="html"></a>
 <a id="css3"></a>
 <body>

     <div style=" width: 500px; height: 600px; background-color: #e4eef9">

         <h1 align="center">网页的超链接设计</h1><hr />

         <h3 style=" text-align:center ">使用锚链接到同一个网页的不同位置</h3>

         <a href="#html">HTML概念</a><br />

         <a href="#css3">CSS3概念</a><br />

         <a href="#JavaScript">JAVAscript概念</a><hr />

         <a id="html"></a>

         <h4>HTML</h4>

         <p>HTML 的具体概念，，，，，，，，，，，你懂得！！！</p>

         <hr />

         <a id="css3"></a>

         <h4>CSS3</h4>

         <p> 的具体概念，急急急急急急   然后你懂得。!!</p>

         <hr />

         <a id="JavaScript"></a>

         <h4>JAVAscript</h4>

         <p>javascrpt 的具体的内容！！！！！然后你懂得！！！</p>

     </div>

 </body>

HTML中网页超链接设计

6>使用锚链接到另一个网页的特定位置。

  <h3 style="text-align:center ">使用锚链接到另一个网页的特定位置</h3>

         <a href="锚链接练习网页1.html#html " target="_blank" title=" 你讲前往下一个网页">HTML的介绍</a><br />

         <a href="锚链接练习网页1.html#css3" target="_blank"  title=" 你就等着瞧吧！哈哈哈">CSS3的介绍</a></div>
 <body>

     <a id="html"></a>

     <h3>HTML介绍</h3>

     <p>hhffhsjkfkjashfkaflh黄飞鸿放寒假啊上课了 废话多萨科技家飞回家看发货就看到就发货啊发卡量发卡量房价控制法律啊安康</p>

     <a id="css3"></a>

     <h3>CSS3介绍</h3>

     <p>发生的恢复健康哈萨克链接粉红色开讲啦护肤老师发科技爱好是开发技术呵呵呵！！！</p>

 </body>

7>

相关文章