常用伪元素及content属性值的使用
1.常用伪元素有 after、before,使用方法,如下
a:after{
display:block;
content:'';
}
2. content: "/\00a0";//表示斜杆
3. a标签的四个伪类:
link /* 未被访问的链接 */
visited /* 已被访问的链接 */
hover /* 鼠标指针移动到链接上 */
active /* 正在被点击的链接 */----------------------可用于其他标签
4.伪元素有六个,分别是 ::after、::before、::first-line、::first-letter、::selection、::backdrop 。
二. 获取伪元素的属性值:
获取伪元素的属性值可以使用 window.getComputedStyle() 方法,获取伪元素的CSS样式声明对象。然后利用getPropertyValue方法或直接使用键值访问都可以获取对应的属性值。
语法:window.getComputedStyle(element,[ pseudoElement])
参数如下:
element(Object):伪元素的所在的DOM元素;
pseudoElement(String):伪元素类型。可选值有:”:after”、”:before”、”:first-line”、”:first-letter”、”:selection”、”:backdrop”;
demo:
var beforeStyle = window.getComputedStyle(myIdElement, ":before");
常用伪元素及content属性值的使用的更多相关文章
- CSS魔法堂:一起玩透伪元素和Content属性
前言 继上篇<CSS魔法堂:稍稍深入伪类选择器>记录完伪类后,我自然而然要向伪元素伸出"魔掌"的啦^_^.本文讲讲述伪元素以及功能强大的Contet属性,让我们可以通 ...
- javascript_获取iframe框架中元素节点的属性值
1. DOM:文档对象模型 [window 对象] 它是一个顶层对象,而不是另一个对象的属性即浏览器的窗口. [document 对象] 该对象是window和frames对象的一个属性,是显示于窗口 ...
- 使用js获取伪元素的content
在测试过程中有时候会遇到反爬虫机制,一些元素会使用伪元素,这样在定位元素的时候会定位不到,这时候就要使用js来帮助定位,获取到想要的元素 下面是部分代码 //使用js获取伪元素的content Str ...
- Selenium_获取元素文本、属性值、尺寸(8)
from selenium import webdriver driver = webdriver.Chrome() driver.maximize_window() driver.get(" ...
- CSS伪元素选择器和属性选择器
伪元素 能使用伪元素来选择元素中的一些特殊位置 一.给段落定义样式 :first-letter 首字母(只能用于块元素) :first-line 第一行 1.为p元素中的第一个字符设置颜色为黄色, ...
- 利用getComputedStyle方法获取元素css的属性值
在平时的工作中有时候会碰到需要获取元素当前样式的问题,查了一下可以用getComputedStyle这个方法来获取元素计算后的样式(有些我们在css里面没有写的,浏览器默认的样式也可以获得) getC ...
- html中的meta元素及viewport属性值
<meta name="viewport" content="width=device-width , initial-scale=1.0, maximum-sca ...
- jquery 获取被点击元素的id属性值
有时候可能需要获取被点击元素的一些信息,此处就以id属性为例子,进行演示一下. $(document).click(function (e){ var v_id=e.target.id; consol ...
- image元素的src属性值与getAttribute('src')值
采集的时候,当采集到一些不可用的照片就将其剔除掉 我的解决思路是new一个img对象, 然后将采集过来的图片赋值给这个img, 然后分别处理img的onerror和 onload, 当在onerror ...
随机推荐
- svn的常用命令
svn :看log.版本库.增删.提交 (1)svn up //代码更新到最新版本. (2)svn checkout //将代码checkout出来. (3)svn revert -R ./ //将代 ...
- androidpn 推送系统
(文中部分内容来自网络,如无意中侵犯了版权,请告之!) XMPP协议: XMPP : The Extensible Messaging andPresence Protocol. 中文全称:可扩展通讯 ...
- HTTP基础知识1
HTTP 简介 HTTP协议(HyperText Transfer Protocol,超文本传输协议)是因特网上应用最为广泛的一种网络传输协议,所有的WWW文件都必须遵守这个标准,它是基于TCP/IP ...
- SpringMVC(4.2):Controller接口控制器详解(2)
原文出处: 张开涛 4.5.ServletForwardingController 将接收到的请求转发到一个命名的servlet,具体示例如下: package cn.javass.chapter4. ...
- LeetCode(29): 两数相除
Medium! 题目描述: 给定两个整数,被除数 dividend 和除数 divisor.将两数相除,要求不使用乘法.除法和 mod 运算符. 返回被除数 dividend 除以除数 divisor ...
- 【mysql】一个很小但很影响速度的地方
如果要插入一大批数据,千万不要一条一条的execute, commit.而应该是先全部execute,最后统一commit!!! 千万注意,时间差距还是很大的!! 正确示范:快 ): sql = &q ...
- \x 开头编码的数据解码成中文
在python里,直接decode('utf-8')即可 >>> "\xE5\x85\x84\xE5\xBC\x9F\xE9\x9A\xBE\xE5\xBD\x93 \xE ...
- VS2010发布、打包安装程序(超全超详细)
1. 在vs2010 选择“新建项目”→“ 其他项目类型”→“ Visual Studio Installer→“安装项目”: 命名为:Setup1 . 这是在VS2010中将有三个文件夹, 1.“应 ...
- ZOJ-3537
题目大意:给你一个n (n<=300) 边形,给出它所有的顶点坐标,让你把它划分成n-2个三角形的花费最小值,顶点 a 和 b 相连的花费为 abs(a.x+b.x)*abs(a.y+b.y). ...
- Python hashlib、hmac加密模块
#用于加密的相关操作,3.x里代替了md5模块和sha模块,主要提供sha1,sha224,sha256,sha384,sha512,md5算法 #sha2为主流加密算法,md5加密方式不如sha2 ...