html 超链接标签 锚点 a标签伪类

一个简易的连接

<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是访问过的

原文地址:https://www.cnblogs.com/abc23/p/9490584.html

时间: 2024-10-09 21:03:35

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

html 16 a链接 锚点 a的伪类

<a href  target  title> #a1   /  本页#a1 a name="a1" a:link   未访问的 a:visited 访问过的 a:hover  鼠标经过的 a:active  访问瞬间的 visited 是访问他链接的页面 比如#  herf="#" 访问过的都会变,不管有几个 active 不设置 顺序是lvha a:link 简写成 a

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

本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 伪类(伪类选择器) 伪类:同一个标签,根据其不同的种状态,有不同的样式.这就叫做"伪类".伪类用冒号来表示. 比如div是属于box类,这一点很明确,就是属于box类.但是a属于什么类?不明确.因为需要看用户点击前是什么状态,点击后是什么状态.所以,就叫做"伪类". 静态伪类和动态伪类 伪类选择器分为两种. (1)静态伪类:只能用于超链接的

第十二节课,css伪类 (转)

一.特殊选择器 1.* 用于匹配任何的标记 2.> 用于指定父子节点关系 3.E + F 毗邻元素选择器,匹配所有紧随E元素之后的同级元素F 4.E ~ F 匹配所有E元素之后的同级元素F 5.名称[表达式] 5.1 E[att] 匹配所有具有att属性的E元素([att]获取所有的定义了att的标签:E[att=val] 匹配所有att属性等于“val”的E元素: 5.2 [att=val] 获取所有定义了att属性并且属性值等于val的标签: 5.3 [att^=val]获取所有定义了att

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

CSS伪类,是一种特殊的类,它针对到CSS选择器起作用,使选中的标签或元素产生特定的效果. CSS伪类的语法就是: 选择器 : 伪类名 { 属性 : 属性值 } 用的最多的伪类就是超链接a的伪类,有:link,:visited,:hover,:active,而且需要按照这个顺序设置,有个简单的记法是,取首字母组成 love hate,记住“爱恨”就行了. 1,  查看超链接a标签的默认样式 新建一个网页a.html,复制下面的内容: <html> <head> </head&

HTML a标签详解(4个伪类、邮件、电话、短信、GPS)

HTML 超链接(链接) HTML使用标签 <a>来设置超文本链接. 超链接可以是一个字,一个词,或者一组词,也可以是一幅图像,您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分. 当您把鼠标指针移动到网页中的某个链接上时,箭头会变为一只小手. 在标签<a> 中使用了href属性来描述链接的地址. 默认情况下,链接将以以下形式出现在浏览器中: 一个未访问过的链接显示为蓝色字体并带有下划线. 访问过的链接显示为紫色并带有下划线. 点击链接时,链接显示为红色并带有下划线. 注意

a 标签的四个伪类

link        有链接属性时visited    链接地址已被访问过active     被用户激活(在鼠标点击与释放之间发生的事件)hover      其鼠标悬停 <!DOCTYPE HTML><html>  <head>  <title>a标签的四个伪类</title>  <meta charset="utf-8">  <meta name="Keywords" conten

实体字符,媒体标签,元素飘动标签,超链接标签

一)实体字符 一些特别的字符会被html认为是关键字,从而在页面无法显示出来,这些特殊的字符我们要用实体字符里代替,这样就能在页面显示出来了: 常用的实体字符: 空格   小于号 < 大于号 > 人民币 ¥: 版权所有 © 注册的商标 ® 在html中,这些字符我们就用实体字符来代替: <body bgcolor="#80FFFF"> 我们即将要学习 <a>"标签"<br/> 这件毛衣的价格是:¥180 <br/

DAY46-前端入门-组合选择器、标签a_img_list、盒模型、伪类、盒模型布局

目录 一.组合选择器 群组选择器 子代选择器 后代选择器 相邻选择器 兄弟选择器 交集选择器 组合选择器的优先级 二.属性选择器 三.盒模型 盒模型概念 盒模型成员介绍 四.边界圆角 单角设置 整体赋值 五.常用标签 超连接标签a 图片标签img 列表标签list 六.伪类选择器 a标签的四大伪类 内容伪类 索引伪类 取反伪类 七.盒模型布局 做页面必备reset操作 盒模型布局基本介绍 display:显示方式 兄弟坑 父子坑 解决方案 一.组合选择器 群组选择器 可以将任意多个选择器分组到一

伪类的用法以及css一些常用的标签

伪类的用法: :link 表示该超链接文字尚未被点选 :visited 表示该超链接文字已被点选过 :active 表示该超链接文字正被点选,但未被放开 :hover 表示当鼠标停留在文字上 css的一些常用属性标签: background:背景颜色 padding(内边框):padding-top(上边距) padding-left(左边距) text-align left 文字靠左right 文字靠右center 文字靠中 background-size:cover 背景填充 原文地址:ht