广播: 关注微信公众号 “jQuery每日经典” ,有更多资料。微信小程序 -- 前端技术API手册 也在公众号首次发布。有需要的联系公众号中QQ。

一.  以“字符串”开头

两种用法的区别是:

a. 以字符串开头,需要用"-"分割开,

b. 以字符串开头,不需要任何分隔符

1. 资料

a)

b) 

2. html代码

<div class="dot-4">横线分割</div>
<div class="dot">字符串本身</div>
<div class="dottest">全字母字符串</div>
<div class="dot_3">下划线分割字符串</div>

3. css代码

a)

[class|="dot"]{
border: 1px solid #000;
}

b)

[class^="dot"]{
border: 1px solid #;
}

4. 效果:

a)

b)

 

css3 选择器的比较(一) -- 以字符串开头的更多相关文章

  1. 总结30个CSS3选择器

    或许大家平时总是在用的选择器都是:#id  .class  以及标签选择器.可是这些还远远不够,为了在开发中更加得心应手,本文总结了30个CSS3选择器,希望对大家有所帮助. 1 *:通用选择器 ;; ...

  2. 总结30个CSS3选择器(转载)

    或许大家平时总是在用的选择器都是:#id  .class  以及标签选择器.可是这些还远远不够,为了在开发中更加得心应手,本文总结了30个CSS3选择器,希望对大家有所帮助. 1 *:通用选择器 * ...

  3. css3选择器(一)

    直接开始正文. 一.css3同级元素通用选择器[update20161228] 选择器:E~F 匹配任何在E元素之后的同级F元素 Note:E~F选择器选中的是E元素后面同级元素中的全部F元素. 例: ...

  4. 神奇的CSS3选择器

    话说园子里也混迹多年了,但是基本没写过blog,写点基础的,那就从css3选择器开始吧. Css3选择器 先说下,为什么提倡使用选择器. 使用选择器可以将样式与元素直接绑定起来,在样式表中什么样式与什 ...

  5. css3 选择器记

    css3 选择器 根据所获取页面中元素的不同,把css3选择器分为五大类: 基本选择器 层次选择器 伪类选择器 动态伪类选择器 目标伪类选择器 语言伪类选择器 UI元素状态伪类选择器 结构伪类选择器 ...

  6. CSS3选择器使用小结

    CSS3 选择器小结 一 通用选择器 1  *{}通配选择符(CSS2):适合所有元素对象. 2  E类型(HTML)选择符(CSS1):以文档语言对象类型DOM作为选择符. 3  E#myid是id ...

  7. CSS3选择器小结

    CSS3 选择器小结 一 通用选择器 1  *{}通配选择符(CSS2):适合所有元素对象. 2  E类型(HTML)选择符(CSS1):以文档语言对象类型DOM作为选择符. 3  E#myid是id ...

  8. 30个CSS3选择器的应用

    或许大家平时总是在用的选择器都是: id class 以及标签选择器.可是这些还远远不够,为了在开发中更加得心应手,本文总结了30个CSS3选 或许大家平时总是在用的选择器都是:#id  .class ...

  9. CSS2属性选择器和css3选择器的用法和区别

    兄弟们,这是我第一次写博客,希望对进来的人有用,写的不好别喷哈,谢谢. css2属性选择器: 1.[attribute] 例子:   [title] 解释:   选择含有  title  属性的所有元 ...

随机推荐

  1. java代码收藏:获取HttpServletRequest中某一前缀的参数

    public static Map getParametersStartingWith(ServletRequest request, String prefix) { Enumeration par ...

  2. C++字符串之一(字符表示)

    在C++中有两种类型可以用于表示字符,char和wchar_t. 但是字符串格式的标准却有很多种,如ASCII,UTF8,UTF16,UTF32等等.字符串的格式和char/wchar_t 的关系是什 ...

  3. enum flags 枚举Flags标示 位运算符

    C#位运算 详见:http://wenku.baidu.com/link?url=4KUNkwuVTm8dwhmPLXeyYytmnDOJnmLG1L2C77kP-rY0On33ksQxwchoTlq ...

  4. 关于chrome浏览器更新后快捷工具失效的解决方法

    更新chrome浏览器到29.0时发现快捷工具的双击关闭标签页失效了,解决办法: 1.打开chrome的文件夹.C:\Program Files (x86)\Google\Chrome\Applica ...

  5. css3设置box-pack和box-align让div里面的元素垂直居中

    只要设置元素的box-pack和box-align即可,这两个属性当前只有webkit和moz支持,要设置垂直居中的话只需要将这两个属性的值都设置为center即可,需要的朋友可以参考下   以前处理 ...

  6. html系列教程--base button canvas caption

    <base> 标签 <base> 标签为页面上的所有链接规定默认地址或默认. demo: <head> <base href="http://www ...

  7. Tomcat7配置数据源(Oracle)

    修改../conf/content.xml <?xml version='1.0' encoding='utf-8'?> <!-- The contents of this file ...

  8. JAVA 从GC日志分析堆内存 第七节

    JAVA 从GC日志分析堆内存 第七节   在上一章中,我们只设置了整个堆的内存大小.但是我们知道,堆又分为了新生代,年老代.他们之间的内存怎么分配呢?新生代又分为Eden和Survivor,他们的比 ...

  9. C++学习笔录3

    1.隐藏:存在于派生类和基类中.只要成员名字相同就叫做隐藏.参数和函数名都相同时,是一种特殊的隐藏,叫做重写,重写只出现在函数中.若需要访问基类中被隐藏的成员,必须访问这种方法:“对象名:类名::隐藏 ...

  10. 【转载】VS2010+VMWare8+VisualDDK1.5.6 创建并调试驱动程序 - 完全教程

    原帖:http://techird.blog.163.com/blog/static/1215640362011112385241568/ 本文描述了如何使用Visual Studio+VMMare+ ...