<HTML><HEAD>

<meta http-equiv="content-Type"content="text/html;charset=utf-8">

<TITLE>css before after基本用法</TITLE>

<style>

    p::before{

        content: "H"

    }

    p::after{

        content: "d"

    }

    a {

        position: relative;

        display: inline-block;

        outline: none;

        text-decoration: none;

        color: #000;

        font-size: 32px;

        padding: 5px 10px;

    }  

    a:hover::before, a:hover::after { position: absolute; }

    a:hover::before { content: "\5B"; left: -10px; }

    a:hover::after { content: "\5D"; right:  -10px; }  

  </style>

<script type="text/javascript"    src="D:/Old PC/D/html/jQuery/jquery-3.1.0.js" ></script>

<script type="text/javascript">

</script>

</HEAD>

<BODY>

  <p>ello Worl</p>

<br/>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  <a href="http://www.baidu.com">aaa</a>

</BODY>

</HTML>

css before after基本用法【转】的更多相关文章

  1. 一个CSS中Z-index的用法

    一个CSS中Z-index的用法 CSS教程:彻底掌握Z-index属性     大多数的CSS属性都很容易使用.常常,当您对标记语言的元素使用CSS属性时,产生的结果会随着您刷新页面而立即呈现.而另 ...

  2. CSS预处理器之SASS用法指南

    CSS预处理器之SASS用法指南 一.什么是SASS Sass是是一种基于ruby编写的CSS预处理器,提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护. 诞生于200 ...

  3. CSS选择器的新用法

    前面的话 现在,预处理器(如sass)似乎已经成为开发CSS的标配,正如几年前jQuery是开发JS的标配一样.JS的querySelector借鉴了jQuery的选择器思想,CSS选择器也借鉴了预处 ...

  4. CSS学习笔记（9）--详解CSS中:nth-child的用法

    详解CSS中:nth-child的用法 前端的哥们想必都接触过css中一个神奇的玩意,可以轻松选取你想要的标签并给与修改添加样式,是不是很给力,它就是“:nth-child”. 下面我将用几个典型的实 ...

  5. css和@import区别用法

    css和@import都是调用外部样式表的方法. 一.用法 (1)link: <link rel="stylesheet" type="text/css" ...

  6. 详解CSS中:nth-child的用法

    前端的哥们想必都接触过css中一个神奇的玩意,可以轻松选取你想要的标签并给与修改添加样式,是不是很给力,它就是“:nth-child”. 下面我将用几个典型的实例来给大家讲解:nth-child的实际 ...

  7. css的定义、用法、注释、命名规则、书写规范

    什么是css: css全名是层叠样式表(Cascading Style Sheets) CSS的作用:给html标签添加"样式",样式定义了如何显示 HTML 元素 标签是可以由自 ...

  8. css 兼容ie8 rgba()用法

    今天遇到了一个问题,要在一个页面中设置一个半透明的白色div.这个貌似不是难题,只需要给这个div设置如下的属性即可: background: rgba(255,255,255,.1); 但是要兼容到 ...

  9. CSS 中 calc() 函数用法

    CSS calc() 函数 calc() 函数用于动态计算长度值. 注意,运算符前后都需要保留一个空格,例如:width: calc(100% - 10px): 任何长度值都可以使用calc()函数进 ...

随机推荐

  1. [2017BUAA软工]个人项目：数独

    一.项目地址 https://github.com/Slontia/Sudoku 附加作业(GUI):https://github.com/Slontia/SudokuGUI 二.开发时间 PSP2. ...

  2. Essential Netty in Action 《Netty 实战(精髓)》读书笔记一

    NIO 最初是为 New Input/Output 的缩写.然而,Java 的 API 已经存在足够长的时间,它不再是新的.现在普遍使用的缩写来表示Nonblocking I/O (非阻塞 I/O). ...

  3. Fuck me 忘记改REDO 造成复制用户超级慢

    . 一个用户的测试环境, 想着复制用户进行功能和单点性能测试. 但是用户数据量较大,见图 2. 发现在测试环境里面复制一个用户 大概耗时2小时20min的时间, 测试虚拟机的配置: 最开始注意到awr ...

  4. ESXi虚拟机出现关机时卡住的问题处理

    1. ESXi在日常使用时经常会遇到机器卡住的情况 这种情况下GUI的方式无从下手, 需要从cli的方式处理 我记得之前写过一个 但是不知道放哪里去了. 再重新写一下. 直接按照图处理 2. 然后xs ...

  5. ComboBox中如何嵌套TreeView控件

      在ComboBox中嵌套TreeView控件,有时候我们在设计界面的时候,由于界面设计的需要,我们需要将TreeView控件嵌套在ComboBox中,因为TreeView控件实在是太占用地方了,要 ...

  6. zabbix2.2 - /tmp/FromDualMySQLagent.lock already exists

    最近升级了线上的zabbix server版本,升级成功后发现日志中一直报出history和history-uint表的主键冲突数据插入不成功的信息,根据主键冲突发生的itemid去库里查,如下 my ...

  7. ThreadLocal的使用场景及实现原理

    1. 什么是ThreadLocal? 线程局部变量(通常,ThreadLocal变量是private static修饰的,此时ThreadLocal变量相当于成为了线程内部的全局变量) 2. 使用场景 ...

  8. double转换为二进制

    arctan 在verilog 里是1qn或2qn格式,所以要把浮点数转换成1qn格式 1.dec2bin(十进制整数变为二进制) Convert decimal to binary number i ...

  9. Markdown 文件转化为work文档

    1. 电脑安装pandoc 链接:https://pan.baidu.com/s/12H5wLO0JWph5TjrbeJI6mg 密码:ssgs 下载安装包解压即可用.记得配置系统环境变量 2.命令行 ...

  10. BZOJ5093 图的价值（NTT+斯特林数）

    显然每个点会提供相同的贡献.于是现在只考虑1号点的贡献.若其度数为i,则在2~n号点选i个连上,剩下的边随便连,这样可以算出答案为 这个式子可以O(n)计算.发现k比较小,于是考虑如何将这个式子化为与 ...