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

<!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. gradle 添加jar依赖，执行grade build时出现“程序包不存在”问题

    引用的第三方依赖的包都找不到了 解决办法 group'com.suneony' version'1.0.0' apply plugin:'java' repositories { mavenLocal ...

  2. JqGrid获得所有选中行数据ID数组，获取所有行的ID数组

    获得选中行的ID数组:var ids = $("jqgridtableid").jqGrid('getGridParam','selarrrow'); 获得所有行的ID数组:var ...

  3. 【Linux】war包的解压与压缩

    现在存在一个war包test.war(以下是在Linux上操作) 1.解压war包 jar –xvf test.war 说明:直接解压到当前文件夹,如果需要解压到指定的文件夹下,需要将test.war ...

  4. 一个简单的knockout.js 和easyui的绑定

    <!DOCTYPE html><html><head><meta charset="UTF-8"><title>Basi ...

  5. 科学计算法帮助类MathUtils

    import java.math.BigDecimal; import java.math.MathContext; import java.math.RoundingMode; /** * 科学计算 ...

  6. 6、javac命令详解

    javac [ options ] [ sourcefiles ] [ @files ] 参数可按任意次序排列. options 命令行选项. sourcefiles 一个或多个要编译的源文件(例如 ...

  7. 用openssl生成SSL使用的私钥和证书，并自己做CA签名（转）

    本 文记叙的是一次基于SSL的socket通讯程序开发中,有关证书,签名,身份验证相关的步骤. 我们的场景下,socket服务端是java语言编写的,客户端是c语言.使用了一个叫做matrixssl的 ...

  8. Android开发之动态检索(Filter)联系人

    1. 将所有联系人都转换为数字串,存到列表中. 将联系人姓名转换为数字串.例如,张丽思创->zlsc->9572. 过程解析: 张 – zhang – z – 9 丽 – li – l – ...

  9. eclipse里面的时间错误，比电脑系统时间慢了8个小时

    eclipse里面的时间错误,比电脑系统时间慢了8个小时 解决办法: 打开<eclipse安装目录>/eclipse.ini文件 在文件末尾追加 -Duser.timezone=Asia/ ...

  10. linux显示桌面快捷键设置

    2013-01-06 10:31:52    Ubuntu显示桌面Indicator  IN: LINUX :-) HOT: 1,246 ℃  18十2011   www.2cto.com   大家一 ...