我们直接看样例然后在来解释使用方法。

<!DOCTYPE html>

<html>

<head>

<style>

input[type="checkbox"]+p:before{

content:"台词：";

}

</style>

</head>



<body>



<input type="checkbox"/><p>我是唐老鸭。</p>

<p>我住在 Duckburg。

</p>



<p><b>凝视：</b>对于在 IE8 中工作的 :before，必须声明 DOCTYPE。

</p>



</body>

</html>

页面效果显演示样例如以下：

我们来解释一下以下这个css写法的用途

input[type="checkbox"]+p:before{

content:"台词：";

}

它仅仅会在checkbox 紧接着的第一个标签为p的段落加上“台词” 这两个字

这里有个 +  和：before的使用方法，+ 这里理解为and的意思，即input[type="checkbox"] 且 第一个p 才会加上样式

第二个样例

看样式写法。

.dataTables_wrapper .row:first-child {

    padding: 12px 0px 4px;

    margin: 0px 0px;

    background-color: #eff3f8;

}

这个样式仅仅会对第一个th 起作用，第二个th是不起作用的。同一时候 最后一个能够这样写.dataTables_wrapper .row:last-child

第三个样例。

用css样式画一个圆

div

{

background-color: #000;

    color: #fff;

    border: 2px solid #fff;

    border-radius: 32px;

    height: 24px;

    width: 24px;

}

css 样式使用方法的累积的更多相关文章

  1. JQuery中操作Css样式的方法

    JQuery中操作Css样式的方法//1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#tw ...

  2. 【转发】JQuery中操作Css样式的方法

    JQuery中操作Css样式的方法 //1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#t ...

  3. 重温JavaScript获取CSS样式的方法（兼容各浏览器）

    众所周知,CSS样式有三种类型:行内样式.内部样式和外部样式,JavaScript获取CSS样式时分为两种情况:行内样式获取法 和 非行内样式获取法 . 一.行内样式获取相对简单,通过element. ...

  4. jquery操作css样式的方法

    jquery操作css样式的方法(设置和获取)

  5. html导入css样式的方法

    在html网页中引入css样式表主要有一下四种方法 1.行内引入 <p style="width:100px;height:40px;color:red;"></ ...

  6. 用原生JS读写CSS样式的方法总结

    为了日后方便查询,本人翻阅了一些资料总结了以下方法,仅限原生JS,如有不对的地方欢迎指出!只求大家看完觉得有学到点什么就OK了!   一.可以通过DOM节点对象的style对象(即CSSStyleDe ...

  7. HTML文档中应用css样式的方法总结

    在HTML文档中应用css样式大致有三种方法:1.link标签链接外部样式表:2.使用style元素包含样式表:3.使用style属性,即内联样式 一.link标签链接外部样式表 先看一条较为标准的l ...

  8. JS中获取CSS样式的方法

    1.对于内联样式,可以直接使用ele.style.属性名(当然也可以用键值对的方式)获得.注意在CSS中单词之间用-连接,在JS中要用驼峰命名法 如 <div id="dv" ...

  9. HTML使用CSS样式的方法

      在html网页中引入css样式表主要有一下四种方法 1.行内引入 <p ></p> 2.嵌入式 <style type="text/css"> ...

随机推荐

  1. STL - 容器 - MultiSet

    MultiSet根据特定排序准则,自动将元素排序.MultiSet允许元素重复.一些常规操作:MultiSetTest.cpp #include <iostream> #include & ...

  2. 【转】TCP/IP详解学习笔记（一）

      TCP/IP详解学习笔记   这位仁兄写得太好了. http://blog.csdn.net/goodboy1881/category/204448.aspx TCP/IP详解学习笔记(13)-T ...

  3. JAVA中MD5加密实现

    MD5加密实现  结 package com.pb; import java.io.UnsupportedEncodingException; import java.security.Message ...

  4. Ubuntu下配置eclipse

    首先要配置jdk:http://www.cnblogs.com/liunanjava/p/4296540.html 一.下载 eclipse:http://www.eclipse.org/downlo ...

  5. 高阶函数 实现sum(2)(3) 柯里化

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  6. JDBC实战案例--利用jdbc实现的宠物信息管理系统

    一.需求: 利用jdbc实现对宠物的信息进行管理的一套系统 宠物信息:宠物ID,宠物类别,宠物名字,宠物性别,宠物年龄,宠物入库日期 系统完成功能:实现对宠物信息的录入,修改,删除,查询. 二.解决方 ...

  7. ab,qps,服务器性能压力

    ab,qps,服务器性能压力   作者及来源: 陳聽溪 - 博客园    收藏到→_→:   摘要: ab,qps,服务器性能压力    http://www.makaidong.com/%E5%8D ...

  8. iOS- 快速实现展示布局

    概述 比较有规律的页面, 快速实现展示布局, 提高开发效率. 详细 代码下载:http://www.demodashi.com/demo/10713.html 看到这个界面,是不是觉得不像那种比较有规 ...

  9. Apache Hadoop 3.0新版本介绍及未来发展方向

    过去十年,Apache Hadoop从无到有,从理论概念演变到如今支撑起若干全球最大的生产集群.接下来的十年,Hadoop将继续壮大,并发展支撑新一轮的更大规模.高效和稳定的集群. 我们此次将向大家全 ...

  10. 关于多线程中使用ArrayList的问题

    多线程全局变量:1.定义只读的全局变量时,必须加final修饰,即使是private的,防止被反射修改.2.对于需要多次读写的全局变量,一定要用ThreadLocal封装,避免多线程并发时变量被多次赋 ...