html a是什么
html的a标签是HTML语言标签。a标签定义超链接,用于从一个页面链接到另一个页面,a元素最重要的属性是href属性,它指定链接的目标。
一、a 标签样式
一组专门的预定义的类称为伪类用于处理超链接的状态,超链接的文字的状态可以通过
伪类选择器+样式类进行控制 <a class="mycls" ></a>
0) 所有状态下的链接.mycls{color:red}
1) a:link 未访问的连接 .mycls a:link{color:blue}
2) a:visited 已访问的链接 .mycls a:visited{color: visited}
3) a:active 激活时(链接获取焦点)链接的颜色 .mycls a:active{color:blue}
一般情况下 a:hiver和a:visited的颜色是一种的,这4个状态的过程是: a:link ->a:hover->a:active->a:visited
另外,a:active不能设置有无下划线(总是有的)
<style>
a {font-size:16px}
a:link {color: blue; text-decoration:none;} //未访问:蓝色、无下划线
a:active:{color: red; } //激活:红色
a:visited {color:purple;text-decoration:none;} //已访问:purple、无下划线
a:hover {color: red; text-decoration:underline;} //鼠标移近:红色、下划线
</style>
二、target的属性
<a>标签的target属性规定在何处打开链接文档
如下面这行表示在新的窗口中打开文档
<a href="http://www.baidu.com" target="_blank"> visit w3school </a>
三、name属性
name属性规定锚(anchor)的名称
可以使用name属性创建html页面中的书签,书签不会以任何独特方式显示,它对读者可以是不可见的。
当使用命名锚(named anchors)时,我们可以创建直接跳转至该命名锚(比如页面中某个小节)的链接,这样使用者就无需不停滚动页面来寻找需要的信息了。
命名语法
<a name="label">锚(显示在页面上的文本)</a>
ps:锚名称可以是任何名字
ps:可以使用id属性来代替name属性,命名锚同样有效
四、a 标签的事件
将<a>标签的href属性值设置为"#",并设置onclick属性。
在这种处理方式下,用户可以很明显地看出哪些文字是超链接。
在 单击该超链接时,也可以执行onclick属性值中的JavaScript语句,并且不会跳转网页。
但是,由于href的属性值为"#",浏览器会自动跳 转到当前网页的顶部。
如果当前网页内容比较多,浏览器窗口出现下拉滚动条时,可以很明显地看到跳转,而这种跳转往往不是网页设计者的本意。
在没有为<a>标签设置onclick属性时,如果单击了该超链接,浏览器会加载href属性中的URL。
如果href属性值并不是一 个URL,而是一个JavaScript语句的话,那么浏览器就会执行该语句。
因此,可以直接将JavaScript语句写在<a>标签的 href属性值中,让href属性代替onclick属性。
在这种处理方式下,既可以响应click事件,又可以不让网页跳转。
在 a 标签的属性值中添加JavaScript语句之前,必须要先使用"javascript:"语句来声明href属性值中的语句为
javaScript语句,否则浏览器就会将href属性值中的JavaScript语句当成URL进行加载。
<a href="javascript:showFlag()">ssgao</a> 执行showFlag()方法
<a href="" onclick="showFlag();">ssgao</a> 执行showFlag()方法,并会跳转到href指向的页面当href=""刷新当前页面
<a href="">ssgao</a> 刷新当前页面
<a href="#" onclick="showFlag();">ssgao</a> 执行showFlag()方法,并会跳转到页面顶部
<a href="#" onclick="javascript:方法;return false;">提交</a>
a href="javascript:void(0)" onclick="javascript:方法;return false;"提交
javascript:void(0)就不会向上跳了:)
还有一个方法是 #this
a href="#this" onclick="javascript:方法"