Html中<a>标签的样式的设置
html中<a>标签的样式的设置、、
------------------------
<html>
<head>
<title>这是网页选项卡的名称</title>
<style type="text/css">
a:link {
color:red;
text-decoration:underline;
}
a:visited {
color:white;
text-decoration:none;
}
a:hover {
color:blue;
text-decoration:underline;
}
a:active {
color:yellow;
text-decoration:none;
}
</style>
</head>
<body>
<div id="sidebar"><a href="#" >链接到aa页面<a></div>
<p><a href="#">这是第一段内容</a></p>
<p><a href="#">这是第一段内容</a></p>
</body>
</html>
a:link,定义正常链接的样式;
a:visited,定义已访问过链接的样式;
a:hover,定义鼠标悬浮在链接上时的样式;
a:active,定义鼠标点击链接时的样式。
链接颜色是红色,访问过后的链接是白色,鼠标悬浮在链接上时是紫色,点击时的颜色是黄色。
a:link {
color:red;
text-decoration:underline;
}
a:visited {
color:white;
text-decoration:none;
}
a:hover {
color:purple;
text-decoration:none;
}
a:active {
color:yellow;
text-decoration:none;
}
-------------------------
链接颜色是红色,访问过后的链接是红色有下滑先,鼠标悬浮在链接上时是白色,点击时的颜色是白色。
a:link, a:visited {
color:#FF0000;
text-decoration:underline;
}
a:hover, a:active {
color:white;
text-decoration:none;
}
-------------------------
每次定义链接样式时务必确认定义的顺序,link--visited--hover-active,也就是我们常说到的LoVe HAte原则(大写字母就是它们的首字母)。
老外总结了一个便于记忆的“爱恨原则”(LoVe/HAte),即四种伪类的首字母:LVHA。定义A链接样式的正确的顺序:a:link、a:visited、a:hover、a:active。
----------------

<html>
<head>
<title>这是网页选项卡的名称</title>
<style type="text/css">
#sidebar a:link, #sidebar a:visiteid {
color:#FF0000;
text-decoration:none;
}
#sidebar a:hover, #sidebar a:active {
color:#000000;
text-decoration:underline;
}
</style>
</head>
<body>
<div id="sidebar"><a href="#" >链接weikong<a></div>
<p><a href="#">这是第一段内容</a></p>
<p><a href="#">这是第一段内容</a></p>
</body>
</html>
定义局部链接样式
在CSS中写上a:link{}这样的定义会使整个页面的链接样式改变,但有些局部链接需要特殊化,这个问题也不难解决,只要在链接样式定义的前面加上指定的id或class就可以了
#sidebar a:link, #sidebar a:visiteid {
color:#FF0000;
text-decoration:none;
}
#sidebar a:hover, #sidebar a:active {
color:#000000;
text-decoration:underline;
}
<div id="sidebar"><a href="#" >链接为空<a></div>
----------------------------------
Html中<a>标签的样式的设置的更多相关文章
- 用JS改变页面中b标签的样式啊 样式的等
用JS改变页面中b标签的样式啊 样式的等 ,实际上是在标签内加上样式 ,用媒体查询的话 ,不能生效 <!DOCTYPE html> <html lang="en&qu ...
- Angular中innerHTML标签的样式不起作用详解
1.背景 在最近angular的项目中,需要用到[innerHTML]标签来指定一个div的样式: //HTML部分 <div class="contents" [inner ...
- Html中<Hr>标签、样式的使用和自定义设置
<Hr>标签中样式的使用和自定义设置... -------------------- ====================== 已经测试过了可以用的Hr样式: <!--这是一部分 ...
- HTML5中 audio标签的样式修改
由于html5的流行,现在移动端大多数的需求都可以使用audio来播放音频,但您可能只是需要很简单的播放/停止效果,但不同的浏览器上的audio样式却不尽人意,那么要怎么改变这个样式呢,其实它的原理比 ...
- 关于css中a标签的样式
CSS为一些特殊效果准备了特定的工具,我们称之为“伪类”.其中有几项是我们经常用到的,下面我们就详细介绍一下经常用于定义链接样式的四个伪类,它们分别是: :link :visited :hover : ...
- BarTender中每个标签提示手动输入的设置方法
我们知道手动输入数据进行标签打印,可以利用BarTender中的数据输入表单来实现.表单的创建有利于提示程序员,输入要打印标签的的数据.如果手动输入数据的标签较多,可以设置表单提示为每个标签提示,减去 ...
- javascript中a标签把href属性设置为“javascript:void(0)”还是会打开空白页面的问题
在项目中有个位置的点击a标签这里要加一个权限判断,但是之前使用的是js动态添加a标签,href的属性值是一个url,但是我要做权限判断之后,我的url就不能设置在href属性中了,这样的话我可以在a标 ...
- H5 音频标签自定义样式修改以及添加播放控制事件
说明: 需求要求这个音频标签首先要是可适配移动端浏览器的,音频样式就是参考微信做的. 最终效果如下: 具体实现 思路: H5 的 <audio> 标签是由浏览器负责实现默认样式的.所以不同 ...
- IIS 配置 FTP 网站 H5 音频标签自定义样式修改以及添加播放控制事件
IIS 配置 FTP 网站 在 服务器管理器 的 Web服务器IIS 上安装 FTP 服务 在 IIS管理器 添加FTP网站 配置防火墙规则 说明:服务器环境是Windows Server 200 ...
随机推荐
- HDFS开发实例
1.列出HDFS中的文件 package com.hdfs.test; import java.io.BufferedReader; import java.io.IOException; impor ...
- sql server之ROW_NUMBER() OVER()取每组的第N行数据
先看个例子: document_id card_holder_id created_date document_type_id 1 1 2015-7-1 1 2 4 2015-7-2 1 3 4 20 ...
- MyEclipse中没有自动提示如何设置
步骤: window->Preferences->Java->Editor->Content Assist->Advanced 将该页面上的所有的未打上勾的选项都勾上就可 ...
- x01.os.20: compile linux-0.11 on the ubuntu
为什么学习 linux 正如不能依靠美国的 GPS 为我们的导弹指示目标一样,很难想像用运行 windows 的电脑去同美国进行信息战.而朝鲜的网络崩溃,再次警示国人,信息战.网络战离我们并不遥远.l ...
- java弱引用之WeakHashMap相关资料
本人博客中有一篇文章对java中的引用有详细的介绍[http://www.cnblogs.com/javaee6/p/4763190.html],java中WeakHashMap这个类就是java弱引 ...
- 关于ActionBar
添加ActionBar: Android 3.0(API 11)(不含API11)以下的版本中,如果需要活动有ActionBar,需要让活动继承ActionBarActivity类,并且在Manife ...
- RedHat6.2搭建FTP服务器
我的环境: A:Red Hat Enterprise 6.2 IP:192.168.16.12 此机作测试端 B:Red Hat Enterprise 6.2 IP:192.168.16.13 此机做 ...
- Visual Studio 2015 和 Apache Cordova 跨平台开发入门(一)
基于 Windows 10 的 Visual Studio 2015 跨平台的应用开发主要分为基于Visual Studio 安装 Xamarin 扩展的跨Android.iOS 和 Windows的 ...
- 关于selenium的CI、框架……
这段时间除了项目测试外,主要在做web自动化的事情,大致总结一下吧,总体的设计模式pageobject+pagefactory+testng的数据驱动,项目用maven来构建,使用jenkins集成, ...
- J2EE,J2SE,J2ME,JDK,SDK,JRE,JVM区别
转自:http://www.metsky.com/archives/547.html 一.J2EE.J2SE.J2ME区别 J2EE——全称Java 2 Enterprise Edition,是Jav ...