#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. JSP三大常用对象request、response、session

    1.request对象 客户端的请求信息被封装在request对象中,通过它才能了解到客户的需求, 然后做出响应.它是HttpServletRequest类的实例. 序号方法说明 objectgetA ...

  2. 星际反作弊2.3for-win7-xp-win8-win10

    星际反作弊2.3for-win7-xp-win8-win10 下载地址 http://wj800.com/rar/scfzb.zip

  3. ViewPager不能高度自适应？height=wrap_content 无效解决办法

    ViewPager用的很多,主要用啦展示广告条.可是高度却不能自适应内容,总是会占满全屏,即使设置android:height="wrap_content"也是没有用的.. 解决办 ...

  4. MyBatis good

    命名解析:为了减少输入量,MyBatis 对所有的命名配置元素(包括语句,结果映射,缓存等)使用了如下的命名解析规则. 完全限定名(比如“com.mypackage.MyMapper.selectAl ...

  5. 浅析Thinkphp框架中运用phprpc扩展模式

    浅析Thinkphp框架中应用phprpc扩展模式 这次的项目舍弃了原来使用Axis2做web服务端的 方案,改用phprpc实现,其一是服务端的thinkphp已集成有该模式接口,其二是phprpc ...

  6. HTML5 postMessage 和 onmessage API 具体应用

    HTML5 postMessage 和 onmessage API 具体应用 随着 HTML5 的发展.了解并熟悉 HTML5 的 API 接口是很重要的.postMessage(send) 和 on ...

  7. linux搭建邮件服务器

    一.概述: 在配置邮件服务器之前,先解释几个概念. 通常使用Email都很容易,但是Internet的邮件系统是通过几个复杂的部分连接而成的,对于最终用户而言,我们熟悉的Outlook,Foxmail ...

  8. javascript条件运算符

    variablename=(condition)?value1:value2 javascript条件运算符

  9. entity framework 中一些常用的函数 转自http://www.cnblogs.com/williamzhu/

    一般查询 var Courses = db.Courses.Where(c => c.Title == "Physics").OrderBy(c => c.Title) ...

  10. IOS实现UIButton图文混排、自定义按钮按下和正常状态下不同的背景颜色、根据文字长度自定义UIButton长度

    在一些项目中,我们需要自定义自己的UIButton,使Button上面同时具有图片和文字描述,实现自定义UIButton的图文混排. 首先我们需要定义一个继承自UIButton的类,同时实现自己的in ...