css选择器nth-child()和nth-of-type()的应用

css选择器nth-child()和nth-of-type()的应用

 1 <style>
 2         .table-striped tbody > tr:nth-child(odd) > td, .table-striped tbody > tr:nth-child(odd) > th {
 3             background-color: #f9f9f9;
 4         }
 5         /*  nth-child():规定属于其父元素的第二个子元素的每个p的背景色;
 6             nth-child(n):选择器匹配属于其父元素的第N个子元素,不论元素的类型,n可以使数字、关键词或表达式
 7             odd和even是可用于匹配下标是奇数或者偶数的子元素的关键词
 8 
 9             nth-of-type(n):选择器匹配属于父元素的特定类型的第N个子元素的每个元素,n可以使数字、关键词或表达式
10 
11             区别:nth-child(),该选择器选取父元素的第N个子元素,与类型无关
12             */
13     </style>
14 
15 
16 <div style="margin-top: 100px;">
17         <table class="table-striped">
18             <tbody>
19                 <tr>
20                     <td>1</td>
21                     <td>dafsdf</td>
22                 </tr>
23                 <tr>
24                     <td>2</td>
25                     <td>QQQQQQQQQ</td>
26                 </tr>
27                 <tr>
28                     <td>3</td>
29                     <td>sssssssssssss</td>
30                 </tr>
31                 <tr>
32                     <td>4</td>
33                     <td>zzzzzzzzzzzzz</td>
34                 </tr>
35             </tbody>
36         </table>
37 
38     </div>

 

转载于:https://www.cnblogs.com/itboy-2009/p/4744516.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/109367.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • C语言fscanf和fprintf函数的用法详解

    C语言fscanf和fprintf函数的用法详解fscanf()和fprintf()函数与前面使用的scanf()和printf()功能相似,都是格式化读写函数,两者的区别在于fscanf()和fprintf()的读写对象不是键盘和显示器,而是磁盘文件。这两个函数的原型为:intfscanf(FILE*fp,char*format,…);intfprintf(FILE*fp,char…

    2022年10月19日
    2
  • ios 越狱 真机调试

    ios 越狱 真机调试开发环境:Xcode4.5.2ios设备需要越狱并从Cydia安装appsync安装appsync步骤:1、找到安装的cydia,第一次运行将会弹出提示,选择开发者即可2、在工具栏中选择软件源(iphone/itouch选管理),然后点右上角的编辑3、点左上角添加4、输入源:http://yuan.duowan.com/(多玩的源),点添加源,等待添加完成,然后点返回C

    2022年5月17日
    37
  • Linux系统(Centos)安装tomcat和部署Web项目

    文章结构1.准备工作2.在Linux下安装Tomcat8.03.Linux中配置tomcat的服务器启动和关闭和配置tomcat的开机启动4.给tomcat配置用户名和密码登录5.使用IDEA打包Maven托管的WEB项目6.将JavaWeb项目发布到Tomcat8.0下面并且访问展示1,准备工作①,下载Linux版本的tomcat服务器,这里根据自己的需求下载相应的版本,作者这里…

    2022年4月6日
    39
  • 文件读写api函数是什么_c语言文件的读和写

    文件读写api函数是什么_c语言文件的读和写文件操作API函数详解在VC中,大多数情况对文件的操作都使用系统提供的API函数,但有的函数我们不是很熟悉,以下提供一些文件操作API函数介绍:一般文件操作APICreateFile打开文件要对文件进行读写等操作,首先必须获得文件句柄,通过该函数可以获得文件句柄,该函数是通向文件世界的大门。ReadFile从文件中读取字节信息。在打开文件获得了文件句柄之后,则

    2025年7月22日
    5
  • 怎么更改wifi频段_TP-Link无线路由器怎么修改无线信道和频段「建议收藏」

    怎么更改wifi频段_TP-Link无线路由器怎么修改无线信道和频段「建议收藏」有时候为了减少WiFi信道干扰,我们会修改一下路由器的信号频段,下面本文以TPLinkTL-WDR6300无线路由器为例,教大家如何改无线改信号频段,以下是具体的设置教程。改路由器信号频段可以在电脑或手机中完成,修改比较简单,下面以PC为例,手机上也是一样的,借助浏览器就可以完成操作。1、首先打开浏览器,然后输入TPLink路由器管理员登录地址:tplogin.cn(也可以是192.168….

    2025年11月11日
    2
  • 轻松搞懂【TF-IDF、word2vec、svm、cnn、textcnn、bilstm、cnn+bilstm、bilstm+attention实现】英文长文本分类[通俗易懂]

    轻松搞懂【TF-IDF、word2vec、svm、cnn、textcnn、bilstm、cnn+bilstm、bilstm+attention实现】英文长文本分类[通俗易懂]项目来源:https://www.kaggle.com/c/word2vec-nlp-tutorial/之前我写过几篇博客:就这?word2vec+BiLSTM、TextCNN、CNN+BiLSTM、BiLSTM+Attention实现中英文情感分类代码详解就这?word2vec+SVM(支持向量机)实现中英文情感分类代码详解这两篇博客主要是基于中文进行情感分类的,那么本篇博客,我会以这个kaggle项目来介绍如何实现英文长文本情感分类。1实验数据本次数据集来源于kaggle项目“Bago

    2022年6月28日
    30

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号