<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. Mind Manager X 10 registry backup key under windows XP

    Windows Registry Editor Version 5.00 [HKEY_CURRENT_USER\Software\Mindjet\MindManager\10] [HKEY_CURRE ...

  2. oracle11.2.0.1 deferred_segment_creation 造成exp imp 空表无法导出的问题

     oracle11g 新增加了 deferred_segment_creation 的属性在创建的数据库表中,如果表中没有数据,并且这个参数是true的话,并不是直接就在数据文件中的增加相应的segm ...

  3. elk认证模块x-pack安装

    一.elasticsearch安装x-pack elasticsearch/bin/elasticsearch-plugin install x-pack ######## -> Downloa ...

  4. python学习笔记八——字典的方法

    4.3.3 字典的方法 字典的常用方法可以极大地提高编程效率.keys()和values()分别返回字典的key列表和value列表.例: dict={"a":"appl ...

  5. PHP的安装，编译，扩展工具

    1.基本容易混淆的概念 pecl php的社区贡献扩展库,全称为PHP Extension Community Library, 是php的底层库, 使用C语言编写 pear php的应用扩展库,全称 ...

  6. java解析Json字符串之懒人大法

    面对Java解析Json字符串的需求,有很多开源工具供我们选择,如google的Gson.阿里巴巴的fastJson.在网上能找到大量的文章讲解这些工具的使用方法.我也是参考这些文章封装了自己的Jso ...

  7. python之使用smtplib模块发送邮件

    # 使用smtplib模块发送邮件 import smtplib from email.mime.text import MIMEText from email.header import Heade ...

  8. 学习记录特别篇之sql，类的继承

    思路: 应用场景: 1.将父类当做一个基础类 大家都去继承该方法,以便少些代码 2.继承父类的方法 同时可以重写该方法时候调用父类原先的方法 实现一石二鸟的效果 即 既增加原先的功能 又新增新的功能 ...

  9. Python面向对象静态方法，类方法，属性方法

    Python面向对象静态方法,类方法,属性方法 属性: 公有属性 (属于类,每个类一份) 普通属性 (属于对象,每个对象一份) 私有属性 (属于对象,跟普通属性相似,只是不能通过对象直接访问) 方法: ...

  10. ansible系列4-关闭ssh首次连接时提示

    在ansible配置文件中找到 /etc/ansible/ansible.cfg 方法1 在配置文件中找到 了解到问题原因为,我们了解到进行ssh连接时,可以使用-o参数将StrictHostKeyC ...