css伪类hover透明度

2024-11-01

CSS入门(定位之浮动定位、伪类之鼠标悬停、光标修改和透明度修改和列表样式)

一.定位所为定位,实际上就是定义元素框相对于其正常位置,应该出现在哪儿定位就是改变元素在页面上的默认位置分类: 普通流定位(元素默认的定位方式) 浮动定位相对定位绝对定位固定定位 1.普通流定位文档流是页面元素默认的定位方式块级:从上到下排列(独占一行) 行级:从左到右排列(不独占一行) 2.浮动定位如果将元素的定位方式设置了浮动定位那么具有以下几个特点 1.浮动元素会脱离文档流,其他未浮动的元素要上前补位 2.浮动元素会停靠在父元素的左边或者右边,或者停靠在其他浮动元素的边缘

【javascript/css】关于鼠标事件onmousexxx和css伪类hover

在运用鼠标移入移出事件时,一般有两种做法,一种是DOM事件的"onmouseover"和"onmouseout",还有一种是css的伪类":hover". 在实际运用中如何选择,取决于清楚明白的了解他们之间的区别. HTML DOM 允许 JavaScript 对 HTML 事件作出反应. 在我们为元素绑定了一个事件,当事件发生的时候,可以执行一段javascript代码. 关于鼠标事件,总共有: onmouseover和onmouseout 鼠

关于css伪类:hover的用法

关于伪类:hover大家都用过,也比较熟悉.今天介绍一种新的用法(不是我发现的,但是以前一直没这么用过).在Chrome浏览器下,当a标签使用display:black;时a:hover的属性浏览器就读不到.解决的方法就是在样式名后直接添加:hover属性(.hao:hover{}).我现在要说的就是样式名称后面可以直接使用:hover,不用非要在a标签内使用.鼠标悬停的效果也会显示. 如: .ss1{color:#454545;height:25px;}.ss1:hover{color:#FF

css 伪类: 1)a:link , a:visited, a:hover, a:active 2):first-child

1. 链接伪类: <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>伪类</title> <style type="text/css"> a:link {color: #FF0000} /* 未访问的链接 */ a:visited {color: #00FF00} /*

超链接标签的CSS伪类link,visited,hover,active

CSS伪类,是一种特殊的类,它针对到CSS选择器起作用,使选中的标签或元素产生特定的效果. CSS伪类的语法就是: 选择器 : 伪类名 { 属性 : 属性值 } 用的最多的伪类就是超链接a的伪类,有:link,:visited,:hover,:active,而且需要按照这个顺序设置,有个简单的记法是,取首字母组成 love hate,记住“爱恨”就行了. 1, 查看超链接a标签的默认样式新建一个网页a.html,复制下面的内容: <html> <head> </head&

CSS伪类和伪元素

一.伪类 CSS伪类用于向某些选择器添加特殊的效果,在W3规范中,CSS伪类有如下几个: CSS2.1 :active:向被激活的元素添加样式(激活是指点击鼠标那一下) :focus:向拥有键盘输入焦点的元素增加样式 :hover:当鼠标悬浮在元素上方时,向元素增加样式 :link:向未被访问的链接增加样式 :visited:向已被访问的链接增加样式 :first-child:向元素的第一个子元素增加样式 :lang:向带有指定lang属性的元素增加样式 CSS3中的伪类(注意CSS3级

CSS 伪类 (Pseudo-classes)

CSS 伪类用于向某些选择器添加特殊的效果. CSS 伪类 (Pseudo-classes)实例: 超链接本例演示如何向文档中的超链接添加不同的颜色. 超链接 2 本例演示如何向超链接添加其他样式. 超链接 - :focus 的使用本例演示如何对超链接应用 :focus 伪类(无法在 IE 中工作). :first-child(首个子对象) 本例演示 :first-child 伪类的用法. :lang(语言) 本例演示 :lang 伪类的用法. 语法伪类的语法: selector : ps

CSS伪类选择器

一.CSS伪类选择器用于给某些选择器添加效果语法规则:选择器:伪选择器例:a:link {color: #FF0000} 未访问的链接 a:visited {color: #00FF00} 已访问的链接 a:hover {color: #FF00FF} 鼠标移动到链接上a:active {color: #0000FF} 选定的链接在<body></body>内<a href=”链接地址”>链接内容文字</a>伪类选择器还可以与css类选择器配合使用a.re

CSS 伪类

Link The :link CSS pseudo-class lets you select links inside elements. This will select any link which has not yet been visited, even those already styled using selector with other link-related pseudo-classes like :hover, :active or :visited. In orde

CSS伪类

CSS伪类:控制元素的某种状态语法:元素名称:伪类名称{属性:值} CSS伪类控制链接状态状态语法未访问的链接 a:link{color:#ff00ff} 已访问的链接 a:visited{color:#00ffff} 鼠标移动到链接上 a:hover{color:$ffaaaa} 鼠标按下链接 a:active{color:#b4b4b4} 注:如果链接不起作用,请修改链接状态顺序为link--visited--hover-active.

应用越来越广泛的css伪类

说起css伪类,学习web前端网页设计的同学们应该对此应该不是很陌生,以前很多的网页的特效大多是通过js来实现的.但是随着CSS3不断开发,利用css实现网页的特效不仅响应不错,而且还减少了很多的代码量.开发网页代码的效率也极大提高,今天我就跟大家分享一下学习css伪类的一些小经验. 对于开始接触css的朋友来说,在看其他人的代码的时候会经常看到 :hover,:foucs,:before,:after等相关代码,其实这些就是css伪类代码.简单来说应用css伪类就是增加了一个块. 接下来我们看

(五)CSS伪类(Pseudo-class)

CSS伪类用于向某些选择器添加特殊的效果.伪类的语法如下: selector : pseudo-class {property: value} CSS类也可以与伪类搭配使用: selector.class : pseudo-class {property: value} 锚伪类: a:link {color: #FF0000} /* 未访问的链接 */ a:visited {color: #00FF00} /* 已访问的链接 */ a:hover {color: #FF00FF} /* 鼠标移动

12、第十二节课，css伪类（转）

一.特殊选择器 1.* 用于匹配任何的标记 2.> 用于指定父子节点关系 3.E + F 毗邻元素选择器,匹配所有紧随E元素之后的同级元素F 4.E ~ F 匹配所有E元素之后的同级元素F 5.名称[表达式] 5.1 E[att] 匹配所有具有att属性的E元素([att]获取所有的定义了att的标签:E[att=val] 匹配所有att属性等于“val”的E元素: 5.2 [att=val] 获取所有定义了att属性并且属性值等于val的标签: 5.3 [att^=val]获取所有定义了att

【从0到1学Web前端】CSS伪类和伪元素

1.CSS中的伪类 CSS 伪类用于向某些选择器加入特殊的效果. 语法: selector : pseudo-class {property: value} CSS 类也可与伪类搭配使用 selector.class : pseudo-class {property: value} 如以下的一段代码: a.red : visited {color: #FF0000} <a class="red" href="css_syntax.asp">CSS Syn

CSS伪类整理笔记

0 伪元素虚拟的一个元素,用于向已有的元素添加特殊效果,可用标签元素实现该效果. css3中规定:伪元素的由两个冒号::开头,然后是伪元素的名称.用两个冒号::是为了区别伪类和伪元素(CSS2中并没有区别).当然,考虑到兼容性,CSS2中已存的伪元素仍然可以使用一个冒号:的语法,但是CSS3中新增的伪元素必须使用两个冒号:: 一个选择器一般来说只能使用一个伪元素,并且伪元素必须处于选择器语句的最后. 常见的伪元素有以下几种: ::after ::before ::first-letter ::

CSS伪类的理解

因为之前一直对css伪类没有过多的了解,在网上看到一段css代码,不能理解 a:hover span.title{ color:red; ......... } 现通过查询css手册,其实css伪类只是表示了一种状态,a:hover只是表示了鼠标悬浮状态下的a标签,和一般的a标签用法没有区别,a:hover span.title即表示为鼠标悬浮状态的a标签的span的样式,和a span.title 用法没有区别

CSS 伪类 (Pseudo-classes)实例

CSS 伪类 (Pseudo-classes)实例CSS 伪类用于向某些选择器添加特殊的效果在支持 CSS 的浏览器中,链接的不同状态都可以不同的方式显示,这些状态包括:活动状态,已被访问状态,未被访问状态,和鼠标悬停状态. a:link {color: #FF0000} /* 未访问的链接 */a:visited {color: #00FF00} /* 已访问的链接 */a:hover {color: #FF00FF} /* 鼠标移动到链接上 */a:active {color: #0000F

谈谈css伪类与伪元素

前端er们大都或多或少地接触过CSS伪类和伪元素,比如最常见的:focus.:hover以及<a>标签的:link.:visited等,伪元素较常见的比如:before.:after等. 在这里也许有不少人都见过:before,::before这样的写法,估计有些人很纳闷,这两者有什么区别吗? 有疑问,那我们就先把疑问解决了先,不要把疑问留着.其实:before,::before这两种写法都是等效,只是:befor是CSS2的写法,::before是CSS3的写法.双冒号(::)这是CSS3

HTML转义字符 Unicode和CSS伪类介绍

CSS 伪类用于向某些选择器添加特殊的效果. a:link {color: #FF0000} /* 未访问的链接 */ a:visited {color: #00FF00} /* 已访问的链接 */ a:hover {color: #FF00FF} /* 鼠标移动到链接上 */ a:active {color: #0000FF} /* 选定的链接 */ p:first-child {font-weight: bold;} /* 伪类来选择元素的第一个子元素 */ a:focus {color:

【从0到1学Web前端】CSS伪类和伪元素分类： HTML+CSS 2015-06-02 22:29 1065人阅读评论(0) 收藏

1.CSS中的伪类 CSS 伪类用于向某些选择器添加特殊的效果. 语法: selector : pseudo-class {property: value} CSS 类也可与伪类搭配使用 selector.class : pseudo-class {property: value} 如下面的一段代码: a.red : visited {color: #FF0000} <a class="red" href="css_syntax.asp">CSS Syn

CSS - 伪类和伪元素的区别

伪类和伪元素皆独立于文档结构.它们获取元素的途径也不是基于id.class.属性这些基础的元素特征,而是在处于特殊状态的元素(伪类),或者是元素中特别的内容(伪元素).区别总结如下: CSS伪类 (Pseudo-classes):用于向某些选择器添加特殊的效果,即在元素当前静态样式的基础上添加特殊效果(一般都是动态效果),所以一个元素达到一个特定状态时,它可能得到一个伪类的样式:当状态改变时,它又会失去这个样式. 属性描述 :active 向被激活的元素添加样式 :focus 向拥有键盘输入焦

css伪类hover透明度

热门专题