<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. PAT 1026 程序运行时间

    https://pintia.cn/problem-sets/994805260223102976/problems/994805295203598336 要获得一个C语言程序的运行时间,常用的方法是 ...

  2. Docker 安装私有镜像库的简单使用

    公司的网络实在是太差了, 想着自己搭建一个私有的镜像库进行使用测试使用.... docker pull registry.docker-cn.com/library/registry docker t ...

  3. Linux中gcc与g++编译器的区别

    一.对于C文件 对于C文件gcc和g++所做的事情确实是一样的,g++在编译C文件时调用了gcc. 二.对于C++文件 1.预处理 预处理gcc与g++做了相同的事. 2.编译 gcc无法自动和c++ ...

  4. Node http请求信息

    //1:加载http模块 httpconst http = require("http");//2:创建http 服务器var server = http.createServer ...

  5. Conjugate Function

    共轭函数 共轭函数的定义: 设函数f:Rn→R,定义函数f∗:Rn→R为: f∗(y)=sup(<y,x>−f(x))  x∈D 此函数称为函数f的共轭函数.即函数yx和函数f(x)之间差 ...

  6. sorted 返回字典的所有键

  7. json_encode转化为数组时带下标

    //错误 data[$i]=[date("y-m-d H:i:s"),数据查询] //正确 data[]=[date("y-m-d H:i:s"),数据查询] ...

  8. sakila数据库及其他数据库实例文件

    下载地址: https://dev.mysql.com/doc/index-other.html Other MySQL Documentation This page provides additi ...

  9. Colored Sticks POJ - 2513（trie树欧拉路）

    题意: 就是无向图欧拉路 解析: 不能用map..超时 在判断是否只有一个联通的时候,我比较喜欢用set,但也不能用set,会超时,反正不能用stl emm 用trie树来编号就好了 #include ...

  10. MT【47】求一道分式的最值

    评:技巧性很大,需要敏锐的洞察力通过柯西不等式把分母变成一样.请记住这个变形$$(a+b+ab+1)=(a+1)(b+1)\le\sqrt{(a^2+1)(b^2+1)}$$