1、网页设计css样式表 选择器+属性。下面是代码。把每一行代码解释下,分别是什么选择器以及作用
1 设置页面所有元素 默认字体为arial
2 标签选择器 body是标签 color是属性 gray是值
作用:设置body的颜色为gray
3 标签选择器 p和span是标签 font-style是属性 italic是值
作用:设置所有的p 和 span标签的字体 设置为倾斜
4 标签选择器 P下面的span是标签 color font-size是属性 #00ff00 12pt是值
作用:设置p下面的span 的color为绿色,字体大小12pt
下面都以此类推吧
5 ID选择器
作用:设置p下面id=t的元素的颜色跟字体
6 类别选择器
作用:设置p下面class=test的元素的字体跟颜色
7 标签选择器
作用:设置p下面id=hello 的span元素的字体跟颜色
8 类别选择器
作用:设置class=test的颜色 字体大小 和加粗
2、网页设计中标签选择器,类选择器,ID选择器,组合选择器区别在哪里?
class 是类选择器
id 是id选择器
都是在css定义类名的时候用到,原则上都可以用,但是一般用类选择器,用id可能与后台程序id类重名
3、关于网页设计里的三种基本选择器和三种复合选择器分别是什么?举例下~
1.标记选择器主要应用在HTML页中的标记样式选择。如P选择器就用于声明网页中有P标记的文本内容,同理,H1选择器则可以标记页面中H1的样式。例如:H1 { font-size:14px;font-weight:bold;color:#ccc;}以上代码表示在所有应用H1选择器的地方,将文字的大小设为14像素并加粗,同时将颜色设为灰色,如果要改变H1的颜色,只需将color属性更改就可以了,比如将color设为#e7eefe来与网页的其他地方协调。2.类别选择器这是一类最常用的选择器,用它来定义网页中需要特殊表现的样式,类别选择器的名称可以由作者自由定义,一般来讲类别选择器的命名最好有一定的意义,使CSS代码更易维护和阅读。例如定义导航就可以使用.hang{}或者是.nav{},不要使用简略或者特殊的字符串,否则可能三天后当你再读你的CSS代码时,就连你自己都搞不清一个样式到底是做什么用的!类别选择器就是CSS类,在HTML表现为调用的class。例如:(1)style.css文件中定义.title { margin:10px;padding:2px 5px;}(2)HTML文件中<p class="title"></p>在上述定义中,p标签将引用CSS文件中的title样式应用到整个p覆盖的范围。p将显示为一个上下左右margin各为10px,上下padding为2px,左右padding为5px的矩形。请注意类别选择器CSS定义和标记选择器的区别:在CSS文件中,标记选择器前边没有"."号,下面我们还会讲到ID选择器,它的定义也不一样,每个ID选择器样式前有一个"#"号,以确定其为ID选择器,而在HTML中则用ID="style"引用。值得注意的是,一个标签可以同时应用多个class选择器,如<h3 class="style1 style2"></h3>,具体大家可以在下边思考并做下实验,笔者在这就不举例了。3.ID选择器(1)ID选择器用法和class基本没有区别,他们的不同之处就在于ID选择器只能在HTML页中使用一次,而class则可以任意多次调用,在CSS文件中,ID 选择器一般写成#idname { bgcolor:#339;font-size:16px;}如果一个ID应用于多个HTML标记,则有可能造成IE编译错误,并且由于ID选择器可以被JAVASCRIPT等调用,所以多个ID会导致JAVA编译错误并崩溃!(2)HTML的引用在HTML中引用ID选择器的代码如下所示:<div id="name"></div>并且ID选择器不能像类别选择器那样同时被一个标签调用。这也是完全错误的语法。 复合选择器就是基本选择器通过不同的链接方式构成的。复合选择器就是两个或多个基本选择器,通过不同方式链接而成的选择器。
4、计算机,网页设计中CSS各选择器的含义,用途和不同,尤其是复合内容选择器?
1元素选择器
HTML文档的元素名称就是元素选择器。 1)语法,例如:html<color:black;>、h1{color:blue;}、p{color:silver;} 2)缺点:不同的元素样式相同,即不能跨元素。所以做不到同一类元素下的细分。
2类选择器
自定义的某种选择器。 1)语法:.className{样式声明} 例如:.myClass{ background-color:pink;font-size:47px; } <h2>h2中的文本</h2> <p>p中的文本</p>
注意事项:
html文件中,所有元素都有一个class属性,如:<p></p>
类选择器还一种用法:<div id="d1"class="s1 s2">hello</div>,样式s1和样式s2对div共同起作用。
3分类选择器
将类选择器和元素选择器结果起来使用,以实现同一类元素下不同样式的细分控制。如<input>元素,又有按钮又有文本框的,采用分类选择器。 1)语法:元素选择器.className{样式声明} 例如: p.myClass{ color:red;font-size:27px } <h2>h2中的文本</h2> <p>p1中的文本</p> <p>p2中的文本</p>
4元素id选择器
以某个元素id的值作为选择器。比较特殊的、页面整体结构的划分一般使用id选择器。 1)语法:定义id选择器时,选择器前面需要有一个“#”号,选择器本身则为文档中某个元素的id属性的值。 例如:#header{ color:red;background:yellow; } <h1 id="header">This is Title<h1>
u 注意事项:
v html文件中,所有元素都有一个id属性。且某个id选择器仅使用一次。
5派生选择器
依靠元素的层次关系来定义。某一包含元素下的一些相同子元素使用派生选择器。 1)语法:通过依据元素在其位置的上下文关系来定义样式,选择器一端包括两个或多个用空格分隔的选择器。 例如:h1 span{color:red;} <h1>This is a<span>important</span>heading</h1>
6选择器分组
对某些选择器定义一些统一的设置(相同的部分)。 1)语法:选择器声明为以逗号隔开的元素列表。 例如:h1,p,div{ border:1px solid black;}
7伪类选择器
伪类用于向某些选择器添加特殊的效果。 1)语法:使用冒号“:”作为结合符,结合符左边是其他选择器,右边是伪类。 2)常用伪类:有些元素有不同的状态,典型的是<a>元素。 ①:link:未访问过的链接 ②:active:激活 ③:visited:访问过的链接 ④:hover:悬停,鼠标移入,所有元素都能用 ⑤:focus:获得焦点 例如:a:link{ color:black;font-size:20px; } a:visited{ color:pink;font-size:20px; } a:hover{ font-size:27px; } a:active{ color:red; }
8选择器优先级
1)基本规则:内联样式 > id选择器 > 类选择器 > 元素选择器
2)优先级从低到高排序:
div < .class < div.class < #id < div#id < #id.class < div#id.class 例如:<div id="id" style="color:black;"></div>
5、网页制作的选择器问题
重用:
经常会用到一些基本的式样叠加,比如字体的颜色和加粗。网页中可能同时出现三种情况:1.字体为红色 2.字体加粗 3.字体红色加粗
这时我们只需要定义前两个css:
.red{color:red;}
.b{font-weight:bold;}
第三种情况时用<div class="red b"></div>
子选择器:
相对来说,简化html文件的代码更加重要,因此在css中使用子选择器非常有益,同时也使css代码更加容易理解。比如下面的代码:
<div id="sub_nav">
<ul>
<li> <a href="#">Item 1</a></li>>
<li> <a href="#">Item 2</a></li>
<li> <a href="#">Item 3</a></li>
</ul>
</div>
如果div li a都有各自的式样,采用子选择器,可以省略代码中li 和a 的class属性,从而简化代码:
#sub_nav { /* Some styling */ }
#sub_nav li { /* Some styling */ }
#sub_nav a { /* Some styling */ }
组选择器:
当一些元素类型、class或者id都有共同的一些属性,你就可以使用组选择器来避免多次的重复定义。这可以节省不少字节。
例如:定义所有标题的字体、颜色和margin,你可以这样写:
h1,h2,h3,h4,h5,h6 {
font-family:"Lucida Grande",Lucida,Arial,Helvetica,sans-serif;
color:#333;
margin:1em 0;
}
如果在使用时,有个别元素需要定义独立样式,你可以再加上新的定义,可以覆盖老的定义,例如:
h1 { font-size:2em; }
h2 { font-size:1.6em; }
重用、子选择器和组选择器的灵活使用可以非常有效的减少代码,同时非常有利的增加代码的可读性,具体的应用需要在具体编写过程中体会。
http://www.souzz.net/html/web/htmlcss/12499.html
6、dreamweaver中三种选择器的区别?
css 的样式的引用来大致有源三种:
1. 对于ID作用,样式的写法为 #div (#号开头):当一个内容或标签被赋予此ID后,自动套用此样式。
2. 对于标签起作用,样式写法类似 table (直接用标签来作为样式名):所有此标签自动套用,一般定义一些全局性的样式,比如字号,颜色等。
3. 必须引用才能起作用,样式写法类似 .table01 (样式名前加点,样式名可以随意定义):这个必须在页面中用 class="table01" 这样的语法引用才能起作用。
7、css选择器有哪些?各种选择器优先级大小顺序
CSS选择器如下:
1. 标签名选择器 div { color:Red;} /即页面中的各个标签名的css样式
2.类选择器 .divClass {color:Red;} /即定义的每个标签的class 中的css样式
3.ID选择器 #myDiv {color:Red;} /即页面中的标签的id
4.后代选择器(类选择器的后代选择器) .divClass span { color:Red;} /即多个选择器以逗号的格式分隔 命名找到准确的标签
5.群组选择器 div,span,img {color:Red} /即具有相同样式的标签分组显示
选择器的优先级
1.最高优先级是 (直接在标签中的设置样式,假设级别为1000)<div style="color:Red;"></div>
2.次优先级是(ID选择器 ,假设级别为100) #myDiv{color:Red;}
3.其次优先级是(类选择器,假设级别为10) .divClass{color:Red;}
4.最后优先级是 (标签选择器,假设级别是 1) div{color:Red;}
5.那么后代选择器的优先级就可以计算了啊
比如 .divClass span { color:Red;} 优先级别就是:10+1=11
8、网页设计中关于新建CSS的选择器类型问题
仅对该文档--指的是css代码直接出现在网页的内部。
新建样式表文件--指的是在网页外部建立一个css文件,网页引用这个文件。
你用的应该是dreamweaver 8.0以下版,类、标签和高级其实在面板上都有一个简短的说明。
高级-----举一个例子,你可以制作导航栏文字,鼠标移动到文字,文字变色或变换背景。
标签-----也就是让你自己定制html元素,比如h1的字体,你可以随意设置大小、颜色等等。
类----你可以把网页里相同的元素定义为一个类,应用这个样式这些元素就会统一了。
9、CSS 选择器有哪些,在网页设计中如何选择使用
<div id="demo">
<div class="inner">
<p><a href="#">链接</a></p>
<p><input type="checkbox" name="" id="" /></p>
</div>
</div>
class 选择器 .inner{ width:100px;}
id 选择器 #demo{ width:100px;}
标签 选择器 p{ width:100px;}
后代选择器 p a{ color: #f60;}
伪类选择器 a:hover{ color: #f00;}
伪元素选择器 a:after{ clear: both;}
属性选择器 input[type=checkbox]{ margin-left: 10px;}
css3选择器
由于ie的问题,比较常用的是前4种选择器。
10、css选择器有哪些?
1、类型选择器
CSS中的一种选择器是元素类型的名称。使用这种选择器(称为类型选择器),可以向这种元素类型的每个实例上应用声明。例如,以下简单规则的选择器是H1,因此规则作用于文档中所有的H1元素。
2、简单属性选择器
CLASS属性
CLASS属性允许向一组在CLASS属性上具有相同值的元素应用声明。BODY内的所有元素都有CLASS属性。从本质上讲,可以使用CLASS属性来分类元素,在样式表中创建规则来引用CLASS属性的值,然后浏览器自动将这些属性应用到该组元素。
类选择器以标志符(句点)开头,用于指示后面是哪种类型的选择器。对于类选择器,之所以选择句点是因为在很多编程语言中它与术语"类"相关联。翻译成英语,标志符表示"带有类名的元素"。
ID属性
ID属性的操作类似于CLASS属性,但有一点重要的不同之处:ID属性的值在整篇文档中必须是唯一的。这使得ID属性可用于设置单个元素的样式规则。包含ID属性的选择器称为ID选择器。
需要注意的是,ID选择器的标志符是散列符号(#)。标志符用来提醒浏览器接下来出现的是ID值。
STYLE属性
尽管在选择器中可以使用CLASS和ID属性值,STYLE属性实际上可以替代整个选择器机制。不是只具有一个能够在选择器中引用的值(这正是ID和CLASS具有的值),STYLE属性的值实际上是一个或多个CSS声明。
通常情况下,使用CSS,设计者将把所有的样式规则置于一个样式表中,该样式表位于文档顶部的STYLE元素内(或在外部进行链接)。但是,使用STYLE属性能够绕过样式表将声明直接放置到文档的开始标记中。
3、组合选择器类型
可以将类型选择器、ID选择器和类选择器组合成不同的选择器类型来构成更复杂的选择器。通过组合选择器,可以更加精确地处理希望赋予某种表示的元素。例如,要组合类型选择器和类选择器,一个元素必须满足两个要求:它必须是正确的类型和正确的类以便使样式规则可以作用于它。
外部信息:伪类和伪元素
在CSS1中,样式通常是基于在HTML源代码中出现的标记和属性。对于很多设计情景而言这种做法完全可行,但是它无法实现设计者希望获得的一些常见的设计效果。
设计伪类和伪元素可以实现其中的一些效果。这两种机制扩充了CSS的表现能力。在CSS1中,使用伪类可以根据一些情况改变文档中链接的样式,如根据链接是否被访问,何时被访问以及用户和文档的交互方式来应用改变。借助于伪元素,可以更改元素的第一个字母和第一行的样式,或者添加源文档中没有出现过的元素。
伪类和伪元素都不存在于HTML;也就是说,它们在HTML代码中是不可见的。这两种机制都得到了精心设计以便能够在CSS以后的版本中做进一步地扩充;也就是说实现更多的效果。