根据兄弟元素的数量来设置样式(CSS揭秘学习笔记)

CSS揭秘学习笔记

li.length == 4

li:first-child:nth-last-child(4),
li:first-child:nth-last-child(4) ~ li {
    /* 当列表正好包含四项时,命中所有列表项 */
}

li.length >= 4

li:first-child:nth-last-child(n+4),
li:first-child:nth-last-child(n+4) ~ li {
    /* 当列表至少包含四项时,命中所有列表项 */
}

li.length <=4

li:first-child:nth-last-child(-n+4),
li:first-child:nth-last-child(-n+4) ~ li {
    /* 当列表最多包含四项时,命中所有列表项 */
}
时间: 2024-08-02 02:42:48

根据兄弟元素的数量来设置样式(CSS揭秘学习笔记)的相关文章

持久化存储——偏好设置,plist,归档---学习笔记二

//一. 本地持久化 //1.沙盒 //1.1 应用程序包:存放的是应用程序的源文件,包括资源文件和可执行文件 NSString *path = [[NSBundle mainBundle]bundlePath]; //1.2 Documents:最常用的目录,iTunes同步该应用时会同步此文件夹中的内容,适合存储重要数据 NSString *documents = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory,NSUserDo

HTML&amp;CSS基础学习笔记1.28-给网页添加一个css样式

CSS是什么? 当HTML配合CSS一起使用时,我们发现页面变得好看了很多.那么CSS到底是什么呢? CSS指层叠样式表 (Cascading Style Sheets),它主要是用于定义HTML标签在浏览器内的显示样式,如文字大小.颜色.字体加粗等. 我们可以这么说,CSS是网页的衣服,它可以用来装饰网页. 那么接下来我们就来试试css吧~ 给网页添加一个CSS样式 尝试给<p>标签直接加了一个[style]属性,并且给标签添加了一个字体颜色.这种在标签上直接添加样式的形式,我们称这种关联方

HTML&amp;CSS基础学习笔记1.29-灵活地使用样式

灵活的使用样式 使用样式的感觉很棒吧! 刚我们使用的内联样式是给具体的标签加上样式,如果有多个标签的时候,我们用内联样式给标签加样式的时候就需要一个个的加过来,这样就很麻烦. 而如果我们使用内部样式表,我们只需要定义<p>标签的文字大小,所有<p>标签就都具有这个样式了. 看个例子吧: 更加实用的使用方式 使用内部样式表,我们能够把页面上的共通样式提取出来.可以省去很多工作量.但是内部样式表并不是最好的方法,比如说,另一个页面也需要这些样式呢? 相对而言,我们更愿意使用外链样式表,

0006-css引入内联和内部和外联样式表-前端学习笔记

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>css样式</title> <!--次选推荐:引入内部样式表--> <!-- <style type="text/css"> p{ color:blue; font-size:15px; } </style> --> <!-

jQuery改变兄弟元素样式,及:not([class=&quot;allclassname&quot;])筛选小结

以前一直对于jquery感到很畏惧,最近做点击图表变色,将其他元素图片复位的小需求,总结了一下一点小心得. 主要两点是:1.将所有兄弟元素的样式设置为一样,对于子元素的遍历: 2.对于特殊不需要变化的兄弟元素的排除: 如下,对所有兄弟元素的样式设置为一样用过有两种方法: 1 <div class="paneltime"> 2 <ul > 3 <li><a>今天</a></li> 4 <li><a&

【温故而知新-Javascript】为DOM元素设置样式

1. 使用样式表 可以通过document.styleSheets属性访问文档中可用的CSS样式表,它会返回一组对象集合,这些对象代表了与文档管理的各个样式表. 每个样式表 都由一个CSSStyleSheet 对象代表,它提供了一组属性和方法来操作文档里的样式. 1.1 获得样式表的基本信息 第一步是获得定义在文档中的样式表的一些基本信息. <!DOCTYPE html> <html lang="en"> <head> <meta charse

css如何匹配第几个li元素并设置样式

css如何匹配第几个li元素并设置样式:如果有一个li元素列表,如果想设置指定位置li的样式.这个在以前可能需要稍微麻烦一些,比如在这个要设置的li元素上添加一个class或者id之类.但是上面的方式不够灵活,下面介绍一下如何通过伪类选择器实现此功能.代码实例: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" con

【使用 DOM】为DOM元素设置样式

1. 使用样式表 可以通过document.styleSheets属性访问文档中可用的CSS样式表,它会返回一组对象集合,这些对象代表了与文档管理的各个样式表. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>为DOM元素设置样式</title> <style title="core st

Windows Phone 为指定容器内的元素设置样式

在Windows Phone中设置元素样式有多种 拿TextBlock来说 1.我们可以直接在控件上设置: <TextBlock Text="自身样式设置" Width="270" FontSize="20" Foreground="#FF6B6A6A"/> 2.也可以这样:在页面的静态资源中设置 <phone:PhoneApplicationPage.Resources> <Style Targ