CSS教程:css组合与CSS嵌套的写法

乔林儿

乔林儿

2016-02-19 15:17

下面是个超简单的CSS教程:css组合与CSS嵌套的写法教程,图老师小编精心挑选推荐,大家行行好,多给几个赞吧,小编吐血跪求~

CSS组合

  你不必重复有相同属性的多个选择符,你只要用英文逗号(,)隔开选择符就可以了。

  比如,你有如下的代码:

h2 { color: red; }
.22333 { color: red; }
.22333com { color: red; }

  则你可以这样写:

h2,.22333,.22333com { color: red; }

  使用组合,你可以一次定义多个CSS,为你节省很多字节和时间。

CSS嵌套

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

  CSS结构好的话,没有必要使用过多的类或者标识选择符。这是因为你可以指定在选择符内的选择符。(或者更好的说法,上下文选择符--译者著)

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

比如:

#top { background-color: #ccc; padding: 1em }
#top h1 { color: #ff0; }
#top p { color: red; font-weight: bold; }

  这就减去不必要的类或者标识选择符,如果应用到像这样的HTML中:

div id="top"
h122333.com/h1
pThis is my recipe for making curry purely with chocolate/p
pMmm mm mmmmm/p
/div

  这是因为,用英文半角空格间隔选择符,我们指明了在标识id内的h1有“#ff0”的颜色,而p则是红色red和粗体bold。

  这可能也会有些复杂(因为可能不止两级,比如在内在内在内在内等等)。你有必要多加练习。

  使用嵌套,可以让你的CSS代码读起来更清晰,能给你制定的元素定制CSS。

展开更多 50%)
分享

猜你喜欢

CSS教程:css组合与CSS嵌套的写法

Web开发
CSS教程:css组合与CSS嵌套的写法

学习CSS组合与CSS嵌套的写法

Web开发
学习CSS组合与CSS嵌套的写法

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

关于CSS组合与CSS嵌套的写法应用

Web开发
关于CSS组合与CSS嵌套的写法应用

简单学习css组合与CSS嵌套的写法

Web开发
简单学习css组合与CSS嵌套的写法

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

CSS代码组合和嵌套

Web开发
CSS代码组合和嵌套

使用不同的CSS写法CSS进阶

Web开发
使用不同的CSS写法CSS进阶

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

win10升级注意事项

win10升级注意事项

JavaScript标题新闻的定时翻滚(IE,FF,Opera,Safari,Chrome)

JavaScript标题新闻的定时翻滚(IE,FF,Opera,Safari,Chrome)
下拉加载更多内容 ↓