CSS样式表——超链接样式
主要作用是给用HTML做的链接修改样式
主要包括:
1.超链接访问前(被点前)状态a:link
2.超链接访问后(被点后)状态a:visited
3.鼠标指向超链接时(放在上面)状态a:hover
4.点击超链接时的状态a:active
注意的是:顺序不能改变 简单记为L V H A
基本格式为:
<style type="text/css">
a:link
{
color:blue;
text-decoration:none;
}
a:visitd
{]
a:hover
{}
a:active
{}
</style>
例子
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>360标签</title> <link href="360小标签css表.css" rel="stylesheet" type="text/css" />
</head> <body>
<table align="center" width="100%" border="0" cellspacing="0" cellpadding="8">
<tr align="center"><font size="+4" face="楷体">
<td><a href="http://www.autohome.com.cn">汽车之家</a></td>
<td><a href="http://zibo.bitauto.com">易 车 网</a></td>
<td><a href="http://www.pcauto.com.cn">太平洋汽车</a></td>
<td><a href="http://www.anjuke.com">安 居 客</a></td>
<td><a href="http://out.zhe800.com">折800</a></td>
<td><a href="http://www.suning.com"><font color="#00CC33">苏宁易购</a></font></td>
</tr>
<tr align="center"><font size="+4" face="楷体">
<td><a href="http://www.12306.cn">12306官网</a></td>
<td><a href="http://www.people.com.cn">人民</a><span>•</span><a href="http://www.xinhuanet.com">新华</a></td>
<td><a href="http://www.ganji.com">赶 集 网</a></td>
<td><a href="http://union.dangdang.com">当 当 网</a></td>
<td><img src="360小图标/途牛.jpg" width="15" /><a href="http://www.tuniu.com">途牛旅游网</a></td>
<td><a href="http://www.baidu.com"><font color="#00CC33"><i><b>1号店</b></i></a> <a href="http://www.baidu.com"><img src="360小图标/抢福袋.jpg" width="40"/></a></td></font>
</tr>
<tr align="center"><font size="+4" face="楷体">
<td><a href="http://www.zhenai.com">真爱婚恋网</a></td>
<td><a href="http://www.moonbasa.com">梦 芭 莎</a></td>
<td><a href="http://www.baidu.com">亚 马 逊</a></td>
<td><a href="http://www.baidu.com">艺 龙 网</a></td>
<td><a href="http://www.baidu.com">去哪儿网</a></td>
<td><a href="http://www.baidu.com">美 丽 说</a></td></font>
</tr>
<tr align="center"><font size="+4" face="楷体">
<td><a href="http://www.baidu.com">美 团 网</a></td>
<td><a href="http://www.baidu.com">乐视视频</a></td>
<td><img src="360小图标/唯品会.jpg" width="15"/><a href="http://www.baidu.com">唯 品 会</a></td>
<td><a href="http://www.baidu.com"><font color="#CC6600">聚美优品</a></td></font>
<td><a href="http://www.baidu.com">搜 房 网</a></td>
<td><a href="http://www.baidu.com">蘑 菇 街</a></td></font>
</tr>
<tr align="center"><font size="+4" face="楷体">
<td><a href="http://www.baidu.com">猎 聘 网</a></td>
<td><a href="http://www.baidu.com">1 药 网</a></td>
<td><a href="http://www.baidu.com">陆金所理财</a></td>
<td><a href="http://www.baidu.com">六 间 房</a></td>
<td><a href="http://www.baidu.com">携程机票</a></td>
<td><a href="http://www.baidu.com">12306·抢票</a></td></font>
</tr>
</table> </body>
</html>
这是未修改样式的超链接(从来没点过的默认蓝色,点过之后默认紫色)
下面用样式表修改
@charset "utf-8";
/* CSS Document */
<style type="text/css">
*
{
margin:0px;
margin:0px;
}
a:link
{
color:#000;
text-decoration:none;}/*下划线*/
a:visited
{
color:#000;
text-decoration:none}
a:hover
{
color:#F00;
text-decoration:underline;}
a:active
{
color:#F60;
text-decoration:underline;}
</style>
效果为:
CSS样式表——超链接样式的更多相关文章
- css样式表:样式分类,选择器。样式属性,格式与布局
样式表分类: 1.内联样式表, 和html联合显示,例:<p style="font-size:14px;">内联样式表</p> 2.内嵌样式表 作为一个独 ...
- 8.20 css样式表:样式分类,选择器。样式属性,
样式表分类: 1.内联样式表, 和html联合显示,例:<p style="font-size:14px;">内联样式表</p> 2.内嵌样式表 作为一个独 ...
- 一起学HTML基础-CSS样式表常用样式属性
样式属性 背景与前景: background-color:#F90; /*背景颜色,样式表优先级最高*/ background-image:url(路径); /*设置背景图片(默认)*/ backgr ...
- 【经验】在CSS中定义超链接样式a:link、a:visited、a:hover、a:active的顺序
以前用CSS一直没有遇到过这个问题,在最近给一个本科同学做的项目里面.出现一些问题,搜索引擎查了一些网站和资料,发现很多人问到这个问题,给出的结果我试了试,大部分都不正确. 给出我试的顺序,可能会对大 ...
- css 样式表 基础 样式
1大小 width 宽度 height 高度 2 背景 background-color 背景色 background-image:url(图片位置) 背景图片 background-repeat: ...
- css form表单样式清除
开发项目中表单常用的清楚样式: 1.改变placeholder默认字体颜色 ::-webkit-input-placeholder{color: #333;} :-moz-placeholder{co ...
- CSS样式表 选择器
1.内联样式表 和HTML联合显示,控制精确,但是可重用性差,冗余较多. 例:<p style="font-size:14px;">内联样式表</p> &l ...
- 3月22日 html(三)css样式表
CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确,但是可重用性差,冗余较多. 例 ...
- css样式表及属性
CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/ 此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控 ...
随机推荐
- Python 各种库的安装
在Win7 系统安装的Python 各种库,如:pandas.numpy.scipy等 因为平时使用的是IDE-PyCharm,这里可以直接 [File-Setting-Project:XXX-“+” ...
- PHP5.3新特性
1.首先对之前滥用的语法进行了规范 众所周知PHP在语言开发过程中有一个很好的容错性,导致在数组或全局变量中包含字符串不使用引号是可以不报错的,很多业余的开发者因为懒惰而产生的安全问题十分严重,之所以 ...
- Android开发学习之对话框浅析
对话框式程序运行中弹出的窗口.Android系统中有四种默认的对话框:警告对话框AlertDialog.进度对话框ProgressDialog.日期选择对话框DatePickerDialog以及时间选 ...
- 配置SELINUX
selinux的配置文件:# more /etc/selinux/config # This file controls the state of SELinux on the system. # S ...
- RAC安装gird,第一个节点执行root.sh报"The ora.asm resource is not ONLINE"错误
RAC版本:11.2.0.4 OS版本:linux 6.4 RAC安装gird,第一个节点执行root.sh运行失败,报"The ora.asm resource is not ONLINE ...
- Android 轻松实现语音识别
2010-11-12 17:01:51 标签:休闲 职场 Android 语音识别 移动开发 原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任 ...
- KASAN实现原理
1. 前言 KASAN是一个动态检测内存错误的工具.KASAN可以检测全局变量.栈.堆分配的内存发生越界访问等问题.功能比SLUB DEBUG功能齐全并且支持实时检测.越界访问的严重性和危害性通过我之 ...
- iOS_21团购_Popover适应iPad横竖屏切换
终于效果图: 代码片段: // // DockItemLocation.m // 帅哥_团购 // // Created by beyond on 14-8-13. // Copyright (c) ...
- Mark 装修建材 清单
装修攻略 介绍 装修公司:东易.龙发.金螳螂.乐豪斯乳胶漆:多乐士,立邦.三棵树.晨阳水漆.华润.都芳瓷砖:马可波罗.东鹏瓷砖.蒙娜丽莎.诺贝尔.简一瓷砖.欧神诺瓷砖.金舵瓷砖.卓远瓷砖.鹰牌.兴辉瓷 ...
- object-c 获得目录(包括子目录)下所有文件和文件夹路径
void getAllPathNameInDirectory(vector<string>&filePathList,vector<string>&direct ...