网站制作如何用CSS控制超链接样式

  

  网站制作用CSS可控制超链接样式,一般分为四个部分:a:active是超级链接的初始状态;a:hover是把鼠标放上去时的状况;a:link 是鼠标点击时;a:visited是访问过后的情况。

CSS控制超链接的三种方法

1、通过对应超链接外的父级的css类的css样式来控制超链接的样式

案例超链接代码<div class="yangshi"><a href="http://www.wangqi.com/">CSS</a></a>

对应CSS代码

.yangshi a{color:#333;text-decoration:none; }

.yangshi a:hover {color:#CC3300;text-decoration:underline;}

2、通过链接内设置类控制超链接样式css方法

案例超链接代码<a href=http://www.wangqi.com/ class="yangshi">CSS</a>

对应CSS代码

a.yangshi{color:#333;text-decoration:none; }

a.yangshi:hover {color:#CC3300;text-decoration:underline;}

通过这样的设置可以控制链接内的css类名为“yangshi”超链接的样式

3、通常对全站超链接样式化方法

a{color:#333;text-decoration:none; } //对全站有链接的文字颜色样式为color:#333;并立即无下划线text-decoration:none;

a:hover {color:#CC3300;text-decoration:underline;}//对鼠标放到超链接上文字颜色样式变为color:#CC3300;并文字链接加下划线text-decoration:underline;

时间: 2025-01-19 10:31:54

网站制作如何用CSS控制超链接样式的相关文章

巧用CSS控制鼠标样式变换

css|控制|鼠标样式 主页上的鼠标是不是就只有箭头和小手两种模样呢?如果鼠标移到"帮助"等字样上时,形状就变成求助的问号:鼠标移到可能需要较长时间等待的超链接时,鼠标形状就变成等待的样子--那该多好啊! 其实,借助我们的css,几句很简单的代码就可以实现这一切! 不信?把鼠标移到下面的演示文字上看看效果吧! 演示:手形 源代码:<P style="CURSOR: hand">演示:手形</P> 演示:移动 源代码:<p style=c

CSS控制超链接出现指定的效果

要求: (1) 默认样式是黑色,24px,没有下划线: (2) 当鼠标移动到超链接时,自动出现下划线,字号变为40px,颜色变为绿色: (3) 点击后,超链接变成红色 html页面内容: <html> <head> <title>CSS控制超链接的例子</title> <link rel="stylesheet" type="text/css" href="test.css" /> &l

如何用CSS控制网页背景

在符合标准的网页设计中如何用CSS控制网页的背景呢?包括背景的颜色,背景的图片等一些问题,在本教程中一次给你讲清楚. ·背景颜色 background-color 我想这个我就不用多做介绍了,颜色代码我想大家都知道的,不是用英文来代替就是用指定的代码来表示的.这个的默认值是transparent(透明色). 例:body{background-color:yellow} H1{background-color:#000000} ·背景图片 background-image 背景图片和背景颜色在H

CSS控制页面样式的4种方式和优先级问题

本节主要讲解,两个内容, 第一:CSS如何控制页面样式,有几种方式: 第二:这些方式出现在同一个页面时的优先级. 使用xHTML+CSS布局页面,其中有个很重要的特点就是内容与表象相分离,内容指HTML页面代码,表象就是CSS代码了,如果把页面看成穿着衣服的人的话,人就是HTML,是内容,而衣服呢就是CSS,是表 象,现在出现的问题是,如何让CSS去控制页面?或者说,如何让衣服穿在人身上,好体现出人得风格特点:不同的CSS就可以使页面出现不同的风格适用不同的网站,而不同的衣服,人穿上后就会体现

网页制作中应用CSS控制文本的主要指令

css|控制|网页 本章CSS的主要作用 本章要介绍的是文字相关的CSS指令.通 常一个网站的内容最多的就是文字了,透过这些文字相关的CSS指令,您可以将您的 网页内容排版得美美的.本章将分两个部份为您介绍,第一部份是字型性质的CSS指 令,用以控制文字字型的各种样式:第二部份介绍的是文字性质的CSS指令,用以控 制文字段落的外观及摆设方式. 字型性质的CSS指令 font-family 设定文字字型 支 持:IE3.IE4适 用:所有元素可能值: <family-name> 字型名称 预设值

如何用CSS控制图片自适应大小?

图片自动适应大小是一个非常常用的功能,在进行制作的时候为了防止图片撑开容器而对图片的尺寸进行必要的控制,我们可不可以用CSS控制图片使它自适应大小呢? 我们想到了一个比较简单的解决方法,虽然不是非常的完美,如果您的要求不是非常高,已经可以满足你的需要了.我们看下面的代码:  代码如下 复制代码 div img {  max-width:600px;  width:600px;  width:expression(document.body.clientWidth>600?"600px&qu

手把手教你的jquery+CSS控制打印样式实例

一.添加打印样式 1. 为屏幕显示和打印分别准备一个css文件,如下所示:   用于屏幕显示的css: <link rel="stylesheet" href="css/mainstylesheet.css" media="screen" />   用于打印的css:<link rel="stylesheet" href="css/printstylesheet.css" media=&q

用CSS控制滚动条样式

运筹帷幄 用CSS控制网站总“队形”

css|控制 网页设计中我们通常需要统一网页的整体风格,统一的风格大部分涉及到网页中文字属性.网页背景色以及链接文字属性等等,如果我们应用CSS来控制这些属性,会大大提高网页设计速度,更加统一网页总体效果. 为了达到修改整个网页的目的,我们需要编辑一个外挂式的CSS文档.根据这个文档定义和修改不同CSS属性并在页面元素相同或者相似的网页里调用它. 整体改变页面风格 现在网页中流行宋体的9pt和10.5pt的字体,按快捷键"Shift+F11"打开"CSS Style控制面板&