#p1:before{
content: "哈哈哈 ";
color: red;
}
#p1:after{
content: "哈哈哈";
color: #452dff;
}
content: url('img.jpg');
content: attr(href);
content: " (" attr(href) ")"

太极图

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title></title>

     <style type="text/css">

         #p1:before{

             content: "哈哈哈 ";

             color: red;

         }

         #p1:after{

             content: "哈哈哈";

             color: #452dff;

         }

        #a1:after{

            content: attr(href);

        }

         #yin-yang {

             width: 96px;

             height: 48px;

             background: #eee;

             border-color: red;

             border-style: solid;

             border-width: 2px 2px 50px 2px;

             border-radius: 100%;

             position: relative;

         }

         #yin-yang:before {

             content: "";

             position: absolute;

             top: 50%;

             left:;

             background: #eee;

             border: 18px solid red;

             border-radius: 100%;

             width: 12px;

             height: 12px;

         }

         #yin-yang:after {

             content: "";

             position: absolute;

             top: 50%;

             left: 50%;

             background: red;

             border: 18px solid #eee;

             border-radius:100%;

             width: 12px;

             height: 12px;

         }

     </style>

 </head>

 <body>

 <p id="p1">我是一个兵  </p>

 <a id="a1" href="https://www.baidu.com">百度</a>

 <br>

 <div id="yin-yang"></div>

 </body>

 </html>

分割线

.mask { overflow: hidden; height: 20px; }
.mask:after { content: ''; display: block; margin: -25px auto 0; width: 100%; height: 25px; border-radius: 125px/12px; box-shadow: 0 0 8px black; }

随机推荐

  1. R包——jiebaR分词器

    关于R的分词器jiebaR 关于R的分词器jiebaR "结巴"中文分词的R语言版本,支持最大概率法(Maximum Probability),隐式马尔科夫模型(Hidden Ma ...

  2. Main方法中传入参数

    ↓ 这个时候会报错: Instantiate the class:DonutShop java.lang.ClassNotFoundException: DonutShop    at java.ne ...

  3. K-Modes算法[聚类算法]

    聚类算法k-Modes的实现 <?php /* *Kmodes算法(聚类算法的实现) */ /* *获取簇的数目 */ //----------------------------------- ...

  4. sql2012管理

    一.还原完整备份的语法如下: RESTORE DATABASE { database_name | @database_name_var }                  --数据库名 [ FRO ...

  5. Arcgis for javascript不同的状态下自己定义鼠标样式

    俗话说:爱美之心.人皆有之. 是的.没错,即使我仅仅是一个做地图的,我也希望自己的地图看起来好看一点. 在本文,给大家讲讲在Arcgis for javascript下怎样自己定义鼠标样式. 首先.说 ...

  6. SSO 基于Cookie+fliter实现单点登录（SSO）：工作原理

    SSO的概念: 单点登录SSO(Single Sign-On)是身份管理中的一部分. SSO的一种较为通俗的定义是:SSO是指訪问同一server不同应用中的受保护资源的同一用户,仅仅须要登录一次,即 ...

  7. C# 关于数据类型转换

    1.强制转换; 需要注意的一个是char不能强制转化成int,如果使用强制转化,得到的是原整数的ASCII码值.该方式对于浮点数会做无条件舍去,失去精确度. 2.利用方法: 类型.Parse(stri ...

  8. Android消息机制之Handler

    Android为什么要提供Handler Android建议我们不要在UI线程中执行耗时操作,因为这很容易导致ANR异常(在Android源码中我们可以看到,UI如果对用户的操作超过5秒无响应,就会报 ...

  9. iOS 百度地图大头针使用

    百度地图使用第五讲:大头针使用(地图标注)http://bbs.yusian.com/thread-8384-1-1.html(出处: 小龙虾IT笔记)

  10. 用js捕捉鼠标连续点击三次事件怎么实现啊

    var count = 0, timer; document.onclick = function(){ if(count < 2){ if(timer){ clearTimeout(timer ...