css超链接

最新推荐文章于 2024-04-24 09:27:42 发布

龙之华2

最新推荐文章于 2024-04-24 09:27:42 发布

阅读量5k

点赞数 9

分类专栏： HTMLcss超链接文章标签： html css

本文链接：https://blog.csdn.net/weixin_46394746/article/details/117508518

版权

HTMLcss超链接专栏收录该内容

1 篇文章 0 订阅

订阅专栏

一、CSS超链接样式

 <a class=“xxx”></a>

二、CSS超链接样式设置
1、CSS中可以根据超链接元素的状态，设置不同的样式属性
下面为4种超链接状态：
a:link - 正常状态，未访问过的超链接状态
a:visited - 已访问过状态，用户已访问过的超链接状态
a:hover - 鼠标放上状态，当用户鼠标放在超链接上时状态
a:active - 点击状态，超链接被点击的那一刻状态。
运用实例

<style type="text/css">    
.title:link {        
    color: blue;
} 
   
.title:visited {        
    color: green;    
} 
   
.title:hover {        
    color: white; /*字体白色*/        
    font-size: 150%;        
    background: #000000; /*背景黑色*/      
    text-decoration: none; /*去掉文字下划线*/    
}    
</style>
<a href="#" class="title">CSS超链接</a>

2、CSS鼠标指针
设置鼠标形状 cursor:pointer;
在这里插入图片描述
3、设置超链接的样式（颜色、背景、字体……）
运用实例：

<html>
<meta charset="UTF-8">
<title>CSS</title>
<style type="text/css">    
    .title {        
        color: #FFFFFF; /* 白色字体 */        
        background-color: blue; /* 蓝色背景 */        
        font-size: 34px; /* 34px 字体 */        
        text-decoration: none;/* 去掉链接文字的下划线 */
        cursor:wait; /* 改变鼠标形状 */    
    }    
</style>
<body>
    <a href="#">CSS</a>    
    <a href="#" class="title">CSS超链接</a>    
</body>
</html>

龙之华2

关注

9
点赞
踩
29

收藏

觉得还不错? 一键收藏
0
评论
css超链接

一、CSS超链接样式二、CSS超链接样式设置1、CSS中可以根据超链接元素的状态，设置不同的样式属性下面为4种超链接状态：a:link - 正常状态，未访问过的超链接状态a:visited - 已访问过状态，用户已访问过的超链接状态a:hover - 鼠标放上状态，当用户鼠标放在超链接上时状态a:active - 点击状态，超链接被点击的那一刻状态。运用实例CSS超链接2、CSS鼠标指针设置鼠标形状 cursor:pointer;3、设置超链接的样式（颜色、背景、字体……）
复制链接

扫一扫