仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 1172|回复: 8
打印 上一主题 下一主题

[DIV+CSS] CSS教程之写出好的CSS划定规矩:完善的利用:nth-child

[复制链接]
若相依 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-15 23:15:06 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
声明块由一个一个的声明组成,声明由属性和值组成,属性和值用冒号隔开,分号结束。
破洛洛文章简介:当我想要完善的利用:nth-child大概:nth-of-type的时分有点儿头晕。你越了解它们,就可以写出越好的CSS划定规矩!
译自:Useful:nth-childRecipies
中文:有效的:nth-child秘方
请尊敬版权,转载请说明来历,多谢!

当我想要完善的利用:nth-child大概:nth-of-type的时分有点儿头晕。你越了解它们,就可以写出越好的CSS划定规矩!
在这些复杂的”秘方”(实践上是表达式)中我将反复的利用一个复杂的列表并随即选择数字。可是很分明很简单改动它们以取得相似的选择器。
只选择第五个元素

  1. 123
复制代码
  1. li:nth-child(5){color:green;}
复制代码
要选择第一个元素,你可使用:first-child,大概我信任你也能够改下下面的例子来完成。
选择除后面的五个以外的一切元素

  1. li:nth-child(n+6){color:green;}
复制代码
假如有凌驾10个元素,它将会选中凌驾5个。
只选择后面的5个

  1. 123
复制代码
  1. li:nth-child(-n+5){color:green;}
复制代码
从入手下手的谁人,选择每第四个

  1. 1234
复制代码
  1. li:nth-child(4n-7){/*or4n+1*/color:green;}
复制代码
选择奇数大概偶数

  1. 123
复制代码
  1. li:nth-child(odd){color:green;}
复制代码
  1. 123
复制代码
  1. li:nth-child(5){color:green;}0
复制代码
固然这里也有别的两种完成,你懂的——神飞
选择最初一个元素

  1. 123
复制代码
  1. li:nth-child(5){color:green;}2
复制代码
选择倒数第二个

  1. 123
复制代码
  1. li:nth-child(5){color:green;}4
复制代码
从这个例子可看出,下面谁人例子也有第二种完成办法。
扫瞄器撑持

风趣的是,:first-child和:last-child被IE7撑持,可是晓得IE9才撑持剩下的选择器。假如你忧虑IE,可使用Selectivizr。假如你扫瞄器兼容性对你很主要,请存眷WhencanIuse…
嗯,利用CSS3选择器是件很风趣的事变,像做复杂的数学题一样。
</p>
你的设计不仅仅用于web浏览器,也可以发布在其他设备上,比如PowerPoint。
小女巫 该用户已被删除
沙发
发表于 2015-1-17 20:54:31 | 只看该作者
Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH,专业网页图像设计软件FIREWORKS,并称为“网页三剑客”。
小妖女 该用户已被删除
板凳
发表于 2015-1-26 19:09:24 | 只看该作者
是当我和赵丽芬崔明艳老师进行交流后,很快就了解了还不太清楚的内容和并不了解的知识(像布局表格、绘制布局单元格等)。
再现理想 该用户已被删除
地板
发表于 2015-2-4 21:19:55 | 只看该作者
Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。
爱飞 该用户已被删除
5#
发表于 2015-2-10 15:24:41 | 只看该作者
Adobe Dreamweaver CS5 软件使设计人员和开发人员能充满自信地构建基于标准的网站。由于同新的 Adobe CS Live 在线服务 Adobe BrowserLab 集成。
乐观 该用户已被删除
6#
发表于 2015-3-1 13:57:20 | 只看该作者
Dreamweaver在所见即所得添加链接,也可以先选中文字或图片然后在属性栏中的链接栏后的一个小圆圈,用鼠标点击小圆圈按住不放拖动出箭头然后指向文件即可。
灵魂腐蚀 该用户已被删除
7#
发表于 2015-3-10 20:00:09 | 只看该作者
我深感到交流的重要。善于交流的人才是善于学习的人。在整个技术的学习过程中,我总结了四大定律:兴趣、恒心、虚心、时间。
小魔女 该用户已被删除
8#
发表于 2015-3-17 11:06:30 | 只看该作者
不管老师做怎样的解释,而我却对它感到很是吃力,诸如里面有许多不知道的功能。
谁可相欹 该用户已被删除
9#
发表于 2015-3-24 08:44:42 | 只看该作者
难以逾越的障碍会大大打击你的学习积极性。这就需要你的恒心,坚持不懈的决心。在自己无法解决某些问题时,就需要虚心请教别人.
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-12-23 12:22

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表