a[href^="http:"]{}//所有以http开头的href元素

a[href$="pdf"]{}//所有以pdf结尾的href元素

a[href*="xxx"]{}//所有包含xxx内容的href元素

<style>

a[href^="http:"]{

background:url("images/rar.png") no-repeat left center;

background-color: #dddddd;

border:2px dotted;

}

a[href$="word.com"]{

background: url("images/word.png") no-repeat left center;

padding-left: 18px;;

}

a[href$="pdf.com"]{

background: url("images/pdf.png") no-repeat left center;

padding-left: 18px;;

}

a[href$="rar.com"]{

background: url("images/rar.png") no-repeat left center;

padding-left: 18px;;

}

a[href*="com"]{

color: green;

}

全局 同body

:root{}

tr:nth-child(odd)

tr:nth-child(even)

odd = 2n even = 2n+1 一奇一偶

倒数第二个

tr:nth-last-child(2){}

tr:nth-of-type(3){}

th:nth-of-type(3){}

td:nth-of-type(3){}

td:last-child{}

td:first-of-type{}

td:last-of-type{}

只有一个td的行

td:only-child{}

td:only-of-type{}

td:empty{}

</style>

<body>

<p><a href="http://www.pdf.com">http://www.pdf.com</a></p>
<p><a href="http://www.rar.com">http://www.rar.com</a></p>
<p><a href="http://www.word.com">http://www.word.com</a></p>
<p><a href="http://www.pdf.com">http://www.pdf.com</a></p>
<p><a href="http://www.rar.com">http://www.rar.com</a></p>
<p><a href="http://www.word.com">http://www.word.com</a></p>
<table>
    <tr><th>111</th><th>34444</th><th>333</th></tr>
    <tr><td>11111111111</td><td>22222222222222</td><td>33333333333333</td></tr>
    <tr><td>444444</td><td>55</td><td>66</td></tr>
    <tr><td>11111111111</td><td>22222222222222</td><td>33333333333333</td></tr>
    <tr><td>1</td><td>222222221222222</td><td>333333334333333</td></tr>
    <tr><td>111112111111</td><td>222222222222222</td><td>3333343333333333</td></tr>
    <tr><td>11111111111</td><td>22222222222222</td><td>33333333333333</td></tr>
</table>

</body>

转载于:https://www.cnblogs.com/doublegi/p/5747967.html

css3学习下...相关推荐

  1. HTML5与CSS3权威指南之CSS3学习记录

    title: HTML5与CSS3权威指南之CSS3学习记录 toc: true date: 2018-10-14 00:06:09 学习资料--<HTML5与CSS3权威指南>(第3版) ...

  2. css3学习 理论之渐变

    下面来一起学习下css3的渐变,激动人心啊,终于可以不用图片来做渐变背景了.. webkit和gecko引擎对于css3的渐变实现有一定的差异,只能分开学习. 一.webkit -webkit-gra ...

  3. 前端HTML5+CSS3学习笔记

    HTML5+CSS3学习笔记 ==CSS第一天== 一.css简介 二.css语法规范 三.css代码风格 四.css选择器的作用 五.css基础选择器 1.标签选择器: 2.类选择器 3.多类名选择 ...

  4. 千峰HTML5+CSS3学习笔记

    千峰HTML5+CSS3学习笔记 文章目录 千峰HTML5+CSS3学习笔记 写在前面 1. 前言 2. HTML 3. CSS 3.1 选择器 3.2 CSS属性 4. 盒子模型 4.1 溢出属性 ...

  5. 【CSS3】CSS3 学习笔记（1w字+）

    CSS3 学习笔记 一 l  CSS 基础 (一)CSS 介绍 1.CSS 教程 2.CSS 编写规范 (二)CSS 基础语法 二 l  CSS 选择器 (一)元素选择器 (二)选择器分组(多个选择器 ...

  6. html盒子左右边框边距,盒子模型之CSS3学习之边框(Border)

    本篇文章给大家带来的内容是关于盒子模型之CSS3学习之边框(Border) ,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 盒子模型之border 边框相关属性 border-wid ...

  7. CSS3学习（五）：display 属性

    CSS3学习(五):display 属性 display 属性是用于控制布局的最重要的 CSS 属性. display 属性 display 属性规定是否/如何显示元素. 每个 HTML 元素都有一个 ...

  8. 使用 CSS3 创建下拉菜单

    当我在为 WordPress 编写 Notepad 主题 时,顺道学习了一些新的 CSS3 特性,现在此分享.查看演示可以看到一款类似 Mac 风格的多级下拉菜单,使用 border-radius,b ...

  9. HTML5+CSS3学习笔记（三）文档流和盒子模型【附练习：图片列表、左侧导航栏】

    HTML5+CSS3学习笔记(三) 本系列更多文章,可以查看专栏 HTML+CSS学习笔记 文章目录 HTML5+CSS3学习笔记(三) 一.CSS布局 1. 文档流(块级元素.行内元素.行内块元素) ...

最新文章

  1. mysql查看存储过程工作记录20130711
  2. linux删除本机mysql_删除Linux本机自带的Apache/PHP/MySQL
  3. java map是有序的吗_Java：如何初始化和填充最终的静态有序Map？
  4. 编译型与解释型、动态语言与静态语言、强类型语言与弱类型语言概念辨析
  5. 借助拳王虚拟项目公社，自动发货系统，卖虚拟教程产品，实现全自动化赚钱的秘密
  6. easyui php分页,easyui datagrid分页 4、easyUI-七种布局（layout）
  7. mybatis报错(三)报错Result Maps collection does not contain value for java.lang.Integer解决方法...
  8. React基础----ReactJS的使用(一)
  9. C#综合揭秘——细说多线程（下）
  10. 静态页面练习（pc和移动端两套）
  11. Java毕设项目-社区居民健康档案管理系统
  12. STM32F4 ETR计数
  13. 两个可能常用到的几何知识（圆与椭圆的方程、求垂直向量）
  14. Android StepsView 步骤控件
  15. 频谱仪原理与重要指标的作用
  16. 一步一步在平衡车上实现卡尔曼滤波
  17. 【NLP】11大Java开源中文分词器的使用方法和分词效果对比
  18. 华为RS升级变成datacome的问题
  19. 订单管理系统 订货系统平台建设三阶段分享
  20. Unity使用新输入系统InputSystem制作飞机大战Demo

热门文章

  1. BZOJ 1086: [SCOI2005]王室联邦( )
  2. 被App Store拒绝的N个原因
  3. 【Windows】线程漫谈——线程同步之信号量和互斥量
  4. 在XIB里面关于@property,@synthesize,release,dealloc的怪现象
  5. extjs string类型转date_extjs 处理Object格式的Date对象
  6. （7）Xilinx PCIE 接口调试总结（学无止境）
  7. FPGA 常用存储器比较
  8. oracle 取记录最大的那条记录_新记录！国内跨高速铁路最大、吊装高度最高的钢横梁顺利吊装到位...
  9. 12. Qt中相关字符串处理
  10. 湖南高校教师评职称计算机等级考试,湖南高校教师职称评审出台新规，这些要点你了解了吗?...