在一起是什么意思:css 规则中两个类连在一起是什么意思？_CSS教程_前端技术
您的位置： &
& 详细内容
比如：.c1.c2{&&& text-decoration:}选择器中 .c1 与 .c2 直接连在一起，中间无空格、无逗号，表示什么意思？看个例子：&head&&style type="text/css"&.c1{&&& color:#ff0000;}.c2{&&& font-style:}.c1.c2{&&& text-decoration:}&/style&&/head&&&body&&p class="c1"&这里是红色&/p&&p class="c2"&这里是斜体&/p&&p class="c1 c2"&这里是红色、斜体、下划线&/p&&/body&结果已经通过文字直接描述出来了，原来 .c1.c2 表示如果一个标签中同时使用了这两个类（不论顺序、不论是否还有其他类），则响应此样式规则。然而在 ie 中，第二个段落中除了有斜体还有下划线，说明它还把 .c1.c2 看作是 .c2。于是，考虑到兼容性的原因，尽量不要使用 .c1.c2 这样的选择器。
本文链接/html/wyzz/CSS/74.html
( 17:47:01)
相关排行总榜不奢望，也不让自己失望！
CSS中组合选择器，算是基础选择器的升级版，
也就是组合去使用基础选择器的意思，因为配合一些 CSS 的专有语法，所以初学者比较难看懂，
下面枚举几个常用的选择器作为例子，略谈一下CSS的组合选择器的使用。
最近要整理一下之前打算写的系列文章，所以这篇算是书接上文了，
没有 也就不会有组合选择器，
首先这个概念要明白，没人能够一步登天，要想飞你就得好好学走，
所以推荐大家基础一定要扎实的去学。
这里有张表格，算是以下例子的索引：
组合选择器列表
多个元素选择，同时匹配所有A元素和B元素，A和B之间用逗号分隔
div,p { color: }
后代元素选择器，匹配所有属于A元素后代的B元素，A和B之间用空格分隔
#nav li { display: }
li a { font-weight: }
子元素选择器，匹配所有A元素的子元素B
div & strong { color:#f00; }
毗邻元素选择器，匹配所有紧随A元素之后的同级元素B
p + p { color:#f00; }
多元素并列选择器
并列是我取的名字，意思就是用逗号分开的选择器都有效。
//css 代码：
div.mydivred,p.mypred{
padding:10px;
background-color:#ffffff;
border:1px #000000 solid;
color:red;
//html 代码
&div class=&mydivred&& div.mydivred&/div&
&p class=&mypred&& p.mypred&/p&
div.mydivred
后代选择器
#fuji .ziji{
padding:10px;
background-color:#ffffff;
border:1px #000000 solid;
color:red;
&div id=&fuji&&&div class=&ziji&& div.ziji&/div&&/div&
子元素选择器
#zys&span {
padding:10px;
background-color:#ffffff;
border:1px #000000 solid;
color:red;
&div id=&zys&&&span class=&any&& div.ziji&/span&&/div&
因为span不是块级元素，所以比较窄。
毗邻元素选择器
//因为怕影响页面其他位置的样式
//所以在前面加了一个#pl限定选择，不明白的童鞋可以看本页例一
#pl p+p{
padding:10px;
background-color:#ffffff;
border:1px #000000 solid;
color:red;
&div id=&pl&&
才疏学浅，尤其是在文笔方面，
本人已经尽力使用最简单的例子，
使用尽量详细的言语去解释了,
如果还是看不懂，那只好自求多福了。
本文算是续写 ,
如果你在基本选择器上有何疑问可以参考此文。
转载请注明转自:不用浮动实现图文并列排版-css-电脑编程网不用浮动实现图文并列排版作者：%e6%9e%97%e9%80%89%e8%87%a3　和相关&&在web开发中，我们经常需要做左图片右文字的排版方式。传统的做法是2个DIV浮动，并用width调整大小，左边放图右边放文字来实现下面的效果
但这样做就会出现问题，我们每次都得去定义右侧文字部分浮动的宽度，而不能实现自动适应宽度的效果。
今天再做一个项目的时候突发奇想，结果实现了右侧文字自动适应宽的的效果。如图
不论怎么改变父容器的宽度，文字总是自动去适应宽度的
现在拿出来与大家一起分享，希望能起到作用。
实现的原理很简单，父元素div设定一个跟图片大小一致的边距，然后让其相对定位。内部图片采用绝对定位，让坐标固定在左上角，右边的东西就随意了。
就这么简单～
&!DOCTYPE html&
&html lang="en" xmlns="http://www.w3.org/1999/xhtml"&
&title&&/title&
&style type="text/css"&
html, body {
font-size: 12
padding: 10
margin: 0;
div.status {
padding-left: 60
margin-bottom: 10
div.status p {
margin: 0 0 5px 0;
line-height: 1.5;
padding: 0;
div.status p span.name {
color: #369;
div.status p.status-cotent {
color: #333;
div.status .face {
div.status div.repost {
border: solid 1px #ACD;
background: #F0FAFF;
padding: 10
div.repost p.repost-cotent {
color: #666 !
&div class="status"&
&img src="//50//1" alt="人名字" class="face" /&
&p class="status-cotent"&&span class="name"&这是说的内容&/span&：甜美范单鞋、凉鞋、小高跟鞋~这几家款式全 淘单鞋的亲赶紧收了。甜美范单鞋、凉鞋、小高跟鞋~这几家款式全 淘单鞋的亲赶紧收了甜美范单鞋、凉鞋、小高跟鞋~这几家款式全 淘单鞋的亲赶紧收了甜美范单鞋、凉鞋、小高跟鞋~这几家款式全 &/p&
&img src="/thumbnail/766f65afjw1dtf50slhz4j.jpg" alt="图片" class="inner-pic" /&
&div class="status"&
&img src="//50//1" alt="人名字" class="face" /&
&p class="status-cotent"&这是说的内容：甜美范单鞋、凉鞋、小高跟鞋~这几家款式全 淘单鞋的亲赶紧收了。甜美范单鞋、凉鞋、小高跟鞋~这几家款式全 淘单鞋的亲赶紧收了甜美范单鞋、凉鞋、小高跟鞋~这几家款式全 淘单鞋的亲赶紧收了甜美范单鞋、凉鞋、小高跟鞋~这几家款式全 &/p&
&div class="repost"&
&p class="repost-cotent"&&span class="name"&@这是说的内容&/span&：甜美范单鞋、凉鞋、小高跟鞋~这几家款式全 淘单鞋的亲赶紧收了。甜美范单鞋、凉鞋、小高跟鞋~这几家款式全 淘单鞋的亲赶紧收了甜美范单鞋、凉鞋、小高跟鞋~这几家款式全 淘单鞋的亲赶紧收了甜美范单鞋、凉鞋、小高跟鞋~这几家款式全 &/p&
&img src="/thumbnail/766f65afjw1dtf50slhz4j.jpg" alt="图片" class="inner-pic" /&
&相关资料：｜｜｜｜｜｜｜不用浮动实现图文并列排版来源网络，如有侵权请告知，即处理！编程Tags：　　　　　　　　　　　　　　　　&　　　　　　　　　　　　　　　　　　　　2011年3月 Web 开发大版内专家分月排行榜第二2011年1月 Web 开发大版内专家分月排行榜第二2010年10月 Web 开发大版内专家分月排行榜第二2010年9月 Web 开发大版内专家分月排行榜第二2010年6月 Web 开发大版内专家分月排行榜第二
2012年10月 Web 开发大版内专家分月排行榜第三2010年7月 Web 开发大版内专家分月排行榜第三
本帖子已过去太久远了，不再提供回复功能。网页设计教程与开发
提供各种常见网页效果
提供各种各样的设计教程
装扮QQ，让QQ变得更酷
设计参考，提高自升水平
学习服务器和操作系统
提供各种素材和工具
收藏学习资料
您现在的位置：&&>>&&>>&&>>&正文
在CSS样式中 .ol是什么意思啊
在CSS样式中.ol是什么意思啊
1〉type类型选择项目符号用的不同样式list-style-type:disc|circle|square|decimal|lower-roman|upper-roman|lower-alpha|upper-alpha|none|armenian|cjk-ideographic|georgian|lower-greek|hebrew|hiragana|hiragana-iroha|katakana|katakana-iroha|lower-latin|upper-latin取值：disc:CSS1默认值。实心圆circle:CSS1空心圆square:CSS1实心方块decimal:CSS1阿拉伯数字lower-roman:CSS1小写罗马数字upper-roman:CSS1大写罗马数字lower-alpha:CSS1小写英文字母upper-alpha:CSS1大写英文字母none:CSS1不使用项目符号armenianl:CSS2未支持。传统的亚美尼亚数字cjk-ideographic:CSS2未支持。浅白的表意数字georgian:CSS2未支持。传统的乔治数字lower-greek:CSS2未支持。基本的希腊小写字母hebrew:CSS2未支持。传统的希伯莱数字hiragana:CSS2未支持。日文平假名字符hiragana-iroha:CSS2未支持。日文平假名序号katakana:CSS2未支持。日文片假名字符katakana-iroha:CSS2未支持。日文片假名序号lower-latin:CSS2未支持。小写拉丁字母upper-latin:CSS2未支持。大写拉丁字母说明：设置或检索对象的列表项所使用的预设标记。若list-style-image属性值为none或指定url地址的图片不能被显示时，此属性将发生作用。假如一个列表项目的左外补丁(margin-left)被设置为0，则列表项目标记不会被显示。左外补丁(margin-left)最小可以被设置为30。仅作用于具有display属性值等于list-item的对象。如li对象。注意：ol对象和ul对象的type属性为其后的所有列表项目(如li对象)指明列表属性。此属性对于currentStyle对象而言是只读的。对于其他对象而言是可读写的。对应的脚本特性为listStyleType。2〉bulletimage是用相应图片代替项目符号list-style-image:none|url(url)取值：none:默认值。不指定图像url(url):使用绝对或相对url地址指定图像说明：设置或检索作为对象的列表项标记的图像。若此属性值为none或指定url地址的图片不能被显示时，list-style-type属性将发生作用。此属性对于currentStyle对象而言是只读的。对于其他对象而言是可读写的。对应的脚本特性为listStyleImage。3〉语法：list-style-position:outside|inside取值：outside:默认值。列表项目标记放置在文本以外，且环绕文本不根据标记对齐inside:列表项目标记放置在文本以内，且环绕文本根据标记对齐说明：设置或检索作为对象的列表项标记如何根据文本排列。假如一个列表项目的左外补丁(margin-left)被设置为0，则列表项目标记不会被显示。左外补丁(margin-left)最小可以被设置为30。仅作用于具有display属性值等于list-item的对象。如li对象。注意：ol对象和ul对象的type属性为其后的所有列表项目(如li对象)指明列表属性。此属性对于currentStyle对象而言是只读的。对于其他对象而言是可读写的。对应的脚本特性为listStylePosition。
转载请注明:破洛洛(谢谢合作)
上一篇文章： 下一篇文章：
网友评论：}