一、超链接的概念:

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>


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>

HTML中网页超链接设计的更多相关文章

  1. python笔记之提取网页中的超链接

    python笔记之提取网页中的超链接 对于提取网页中的超链接,先把网页内容读取出来,然后用beautifulsoup来解析是比较方便的.但是我发现一个问题,如果直接提取a标签的href,就会包含jav ...

  2. 我给女朋友讲编程html系列(3) --html中的超链接标签-a标签 和 框架frame与框架集frameset

    我们浏览网页的时候,当单击某段文字或图片时,就会打开一个新的网页,这里面就使用了超链接. 就比如下图是一个导航类网页,当你单击某个链接就会打开新的网页. 比如,我拿我的qq空间“金河访谈”举例,新建一 ...

  3. WPF中动态更新TextBlock文字中的超链接,文本

    1.------------------------------------------------------------------------- 修改超链接的文本文字: <TextBloc ...

  4. NanUI文档 - 使用网页来设计整个窗口

    NanUI文档目录 NanUI简介 开始使用NanUI 打包并使用内嵌式的HTML/CSS/JS资源 使用网页来设计整个窗口 如何实现C#与Javascript相互掉用(待更新...) 如何处理Nan ...

  5. 【POI】使用POI处理xlsx的cell中的超链接 和 插入图片 和 设置打印区域

    使用POI对xlsx中插入超链接和 插入图片 package com.it.poiTest; import java.awt.image.BufferedImage; import java.io.B ...

  6. django web 中添加超链接

    django web 中添加不传参的超链接的方法如下: html: 在web中的超链接中加入一下url <a href="{% url 'app_name.views.url_func ...

  7. 看懂此文,不再困惑于 JS 中的事件设计

    看懂此文,不再困惑于 JS 中的事件设计 今天刚在关注的微信公众号看到的文章,关于JS事件的,写的很详细也很容易理解,相关的知识点都有总结到,看完就有种很舒畅的感觉,该串起来的知识点都串起来了.反正一 ...

  8. 爬虫_网页url设计

    为什么需要网页URL设计? 每个url不同的结构代表着不同的网页模块和信息的展现形式,为了方便维护与管理 网页url怎么设计? 分层: 主域名,子域名 一般形式为: 主域名:  www.job.com ...

  9. JS 中的事件设计

    看懂此文,不再困惑于 JS 中的事件设计 原文出处: aitangyong    抽空学习了下javascript和jquery的事件设计,收获颇大,总结此贴,和大家分享. (一)事件绑定的几种方式 ...

随机推荐

  1. ucos实时操作系统学习笔记——任务间通信(互斥锁)

    想讲一下ucos任务间通信中的mutex,感觉其设计挺巧妙,同sem一样使用的是event机制实现的,代码不每一行都分析,因为讲的没邵贝贝老师清楚,主要讲一下mutex的内核是如何实现的.可以理解互斥 ...

  2. redux的中间层 --reactjs学习

    React只负责UI层,也就是我们通常在MVC框架中 所说的View层,所以在使用React开发中 我们得引入Redux 负责Model 一开始学习Redux的中间层 有点 摸不到头, 其实只要你注意 ...

  3. vmware rdm

    RDM即裸磁盘映射,基本思想就是将host的磁盘直接映射给虚拟机使用   需要讨论的是: 1.rdm磁盘是否允许设置为共享,即可以映射给多个虚拟机使用(vmware不可用)   在 vSphere W ...

  4. php读取大文件

    高效率计算文件行数 function count_line($file) { $fp=fopen($file, "r"); $i=0; while(!feof($fp)) { // ...

  5. C++ 随机数

    #include <iostream> #include <stdlib.h> #include <time.h> #define random(a,b) (ran ...

  6. TFS2012 自动生成与部署

    思路: 每日构建,自动生成,然后从TFS提交日志中提取版本修订说明,调用打包脚本混淆并生成安装包(系统自带的太锉),最后将相关文件复制到指定网站供浏览下载.自动向测试网站发布,自动生成数据库并初始化. ...

  7. komodo,mysql workBeach

    跨平台的好软件,只不过自己的眼界太狭隘 Ubuntu下PPA安装,打开终端输入命令:   sudo add-apt-repository ppa:mystic-mirage/komodo-edit   ...

  8. 测试技能积木-AWK的简要用法

    做测试工作,经常要分析日志,有的时候活儿还很脏很累,比如抽取符合某些pattern的行,重新格式化等等.有的时候,我们需要也创造一些测试用数据文件.基于上述两种原因,在Unix Like 系统上,一些 ...

  9. DP+路径 URAL 1029 Ministry

    题目传送门 /* 题意:就是从上到下,找到最短路,输出路径 DP+路径:状态转移方程:dp[i][j] = min (dp[i-1][j], dp[i][j-1], dp[i][j+1]) + a[[ ...

  10. UITableview xib里面 cell 按钮的回调

    //  MoreBtnCell.m#import <UIKit/UIKit.h> @interface MoreBtnCell : UITableViewCell @property (w ...