css before after基本用法【转】

 

<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>

 

posted @ 2017-03-18 19:26  苦涩泪滴  阅读(658)  评论(0)    收藏  举报