一个简易的连接

<a href="01.html">01</a>

<body>
<a href="01.html" target="_blank">01</a>
<a href="https://www.bilibili.com/?spm_id_from=666.7.primary_menu.1">
B站</a>
<a href="01.html" title="鼠标放上来">01</a>
</body>

target="_blank" 可以另开一个网页

title在光标放上时,会显示一个title

<body>
<a name="p1"></a>
<p>p1</p>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<a name="p2"></a>
<p>p2</p>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<p>p3</p>
</body>

 在<p>中定义一个名字

在<a>标签中 < a name="p">, 可以达到直接跳转地点的目的

</head>
<body>
<a href="02.html#p1">p1锚点</a>
<a href="02.html#p2">p2锚点</a>
<a href="02.html#p3">p3锚点</a>
<a name="p1"></a>
<p>p1</p>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<a name="p2"></a>
<p>p2</p>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<a name="p3"></a>
<p>p3</p>
<br></br>
<br></br>
<br></br>
<br></br>
<br></br>
<br></br>
<br></br>
<br></br>

<a name="p">先打一个锚点,之后用<a href="p">来跳转  

<css>允许我们针对a标签的4种状态设置各自的css特性,叫做css伪类

<style>
a:link {
color:gray;
}
a:hover {
color:orange;
}
a:active {
color:black;
}
a:visited {
color:purple;
}
</style>
</head>
<body>
<div>
<a href="#">空连接</a>
<a href="#">空连接</a>
<a href="#">空连接</a>
<a href="#">空连接</a>
</div>
<div>
</div>
</body>  

a:link是连接最开始的颜色

a:hover是光标在其上且没点击的颜色

a:active是光标点击且没松手的时刻

a:visited是访问过的

html 超链接标签 锚点 a标签伪类的更多相关文章

  1. python 全栈开发,Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)

    一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...

  2. HTML5新标签使用及CSS选择器(伪类)

    这些标签能够让搜索引擎更直接的解析页面内容. <header></header>语义:文档或者页面的头部 <nav></nav>语义:导航这两者不是组合 ...

  3. 超链接a标签的伪类选择器问题,Link标签与visited标签的失效问题(问题介绍与解决方法)。

    <!DOCTYPE html>< html>< head>     <meta charset="utf-8" />     < ...

  4. python 46 边界圆角 、a_img_list标签 、伪类选择器

    一:边界圆角 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <ti ...

  5. CSS选择器:伪类(图文详解)

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 伪类(伪类选择器) 伪类:同一个标签,根据其不同的种状态,有不同的样式. ...

  6. css 04-CSS选择器:伪类

    04-CSS选择器:伪类 #伪类(伪类选择器) 伪类:同一个标签,根据其不同的种状态,有不同的样式.这就叫做"伪类".伪类用冒号来表示. 比如div是属于box类,这一点很明确,就 ...

  7. 前端开发HTML&css入门——伪类选择器和一些特殊的选择器

    伪类和伪元素 有时候,你需要选择本身没有标签,但是仍然易于识别的网页部位,比如段落首行或鼠标滑过的连接.CSS为他们提供一些选择器:伪类和伪元素. 常用的一些伪类选择器: :link :visited ...

  8. 12、第十二节课,css伪类 (转)

    一.特殊选择器 1.* 用于匹配任何的标记 2.> 用于指定父子节点关系 3.E + F 毗邻元素选择器,匹配所有紧随E元素之后的同级元素F 4.E ~ F 匹配所有E元素之后的同级元素F 5. ...

  9. 超链接标签的CSS伪类link,visited,hover,active

    CSS伪类,是一种特殊的类,它针对到CSS选择器起作用,使选中的标签或元素产生特定的效果. CSS伪类的语法就是: 选择器 : 伪类名 { 属性 : 属性值 } 用的最多的伪类就是超链接a的伪类,有: ...

随机推荐

  1. pip 升级 pip

    For Python2 sudo pip install -i https://pypi.tuna.tsinghua.edu.cn/simple/ --upgrade pip For Python3 ...

  2. 2-STM32物联网开发WIFI(ESP8266)+GPRS(Air202)系统方案安全篇(监听Wi-Fi和APP的数据)

    1-STM32物联网开发WIFI(ESP8266)+GPRS(Air202)系统方案安全篇(来看一下怎么样监听网络数据,监听电脑上位机软件的数据) 因为那个软件只能监听咱自己电脑上的数据,所以咱就用电 ...

  3. 调用Runtime.getruntime 下的exec方法时,有",<,|时该怎么办?

    今天写一个用到编译的程序,遇到了问题. 在调用runtime.exec("javac HelloWorld.java");运行完美,也就是有生成.class. 而到了runtime ...

  4. element ui 时间 date 差一天

    let BirthdayYMD = common.formatDate(this.addForm.Dendline); this.addForm.Dendline = new Date(Birthda ...

  5. VS2010安装MVC4记录

    想学MVC4,但自己电脑上是VS2010,所以在网上查询怎样安装MVC4,总结下给大家. VS2010默认安装的是MVC2,安装MVC4必须先装 SP1,然后安装MVC4. VS2010 SP1 (1 ...

  6. Day5 Numerical simulation of optical wave propagation之通过随机介质(如大气湍流)的传播(一)

    一 分步光束传播方法 到目前为止,人们已经设计出传播算法,用于模拟通过真空和通过可用光线矩阵描述的简单光学系统的传播. 其中分步光束传播方法除了描述上述传播过程,还有更复杂的应用,包括:部分时间和空间 ...

  7. 【问题解决方案】ImportError: No module named 'openpyxl'/‘xlrd’

    背景: 在jupyter notebook to_excle: 运行将dataframe保存为excel文件 df.to_excel('dataframe.xlsx') 时报错openpyxl rea ...

  8. Shell命令-文件及目录操作之touch、tree

    文件及目录操作 - touch.tree 1.touch:创建文件或更改文件时间戳 touch命令的功能说明 touch命令用于创建新的空文件或改变已有文件的时间戳属性. touch命令的语法格式 t ...

  9. ThreadPoolExecutor 中的 shutdown() 、awaitTermination() 、 shutdownNow() 的用法

    shutdown和awaitTermination为接口ExecutorService定义的两个方法,一般情况配合使用来关闭线程池. 方法简介shutdown方法:将线程池状态置为SHUTDOWN.平 ...

  10. python学习day8 文件操作(深度学习)

    文件操作 (day7内容扩展) 1 文件基本操作 obj = open('路径',mode='模式',encoding='编码')obj.write()obj.read()obj.close() 2 ...