1、选择要更改列表项样式的元素。。
2、在样式规则中使用list-style-type属性,指定所需样式。。
3、使用不同的关键词,以改变列表项标记的样式。。
4、将属性应用于其他列表项,如ol(有序列表)和dl(定义列表)。。
二、有利于SEO优化的DIV+CSS的命名规则小结1、CSS文件及样式命名CSS文件命名规范全局样式、global.css。
2、框架布局、layout.css。
3、字体样式、font.css。
4、链接样式、link.css。
5、打印样式、print.css。
6、CSS样式命名规范本人建议、用字母、_号工、-号、数字组成,必须以字母开头,不能为纯数字。
7、为了开发后样式名管理方便,大家请用有意义的单词或缩写组合来命名,让同事一看就明白这样式大概是哪一块的,这样就节省了查找样式的时间,例如、头部样式用header,头部左边,可以用header_left或header_l,还有如果是列结构的可以这样——box_1of3(三列中的第一列),box_2of3(三列中的第二列)、box_3of3(三列中的第三列),其它的我就不一一举例了,大家按以上规律去命名就好。
8、下面列出一些常用的命名单词方便大家使用、(以后大家工作过程中慢慢把自己积累的单词都共享出来,那大家的命就会更加统一了,就不会有一义多词的情况了。
9、)容器、container/box头部、header主导航、mainNav子导航、subNav顶导航、topNav网站标志、logo大广告、banner页面中部、mainBody底部、footer菜单、menu菜单内容、menuContent子菜单、subMenu子菜单内容、subMenuContent搜索、search搜索关键字、keyword搜索范围、range标签文字、tagTitle标签内容、tagContent当前标签、tagCurrent/currentTag标题、title内容、content列表、list当前位置、currentPath侧边栏、sidebar注释、note登录、login注册、register列定义、column_1of3(三列中的第一列)column_2of3(三列中的第二列)column_3of3(三列中的第三列)id和class的使用及区别我们知道在样式表定义一个样式的时候,可以定义id也可以定义class,例如、ID方法、#test{color、#333333},在页面中调用div内容divCLASS方法、.test{color、#333333},在页面中调用divclass="test"内容divid一个页面只可以使用一次,class可以多次引用。
10、我在页面中用了多个相同id在IE中显示也正常,id和class好象没什么区别,用多个相同id有什么影响吗?页面存在多个相同的ID影响就是不能通过W3的校验。
11、在页面显示上,目前的浏览器还都允许你犯这个错误,用多个相同ID“一般情况下”也能正常显示。
12、但是当你需要用JavaScript通过id来控制这个div,那就会出现错误。
13、id是一个标签,用于区分不同的结构和内容,就象你的名字,如果一个屋子有2个人同名,就会出现混淆。
14、class是一个样式,可以套在任何结构和内容上,就象一件衣服。
15、概念上说就是不一样的、id是先找到结构/内容,再给它定义样式。
16、class是先定义好一种样式,再套给多个结构/内容。
17、也就是说建议大家在写XHML+CSS时如果是维一的结构定位的就用id,否则就用class吧(这样让出非结构定位的div块的id让程序员自己定义使用)web标准希望大家用严格的习惯来写代码。
18、使用css缩写使用缩写可以帮助减少你CSS文件的大小,更加容易阅读。
19、常用的css缩写的主要规则、颜色16进制的色彩值,如果每两位的值相同,可以缩写一半,例如、#000000可以缩写为#000#336699可以缩写为#369盒尺寸通常有下面四种书写方法、property、value1表示所有边都是一个值value1。
20、property、value1value2表示top和bottom的值是value1,right和left的值是value2property、value1value2value3表示top的值是valueright和left的值是valuebottom的值是value3property、value1value2value3value4四个值依次表示top,right,bottom,left方便的记忆方法是顺时针,上右下左。
21、具体应用在margin和padding的例子如下、margin、1em02em0.5em边框(border)边框的属性如下、border-width、1pxborder-style、solidborder-color、#000可以缩写为一句、border、1pxsolid#000语法是border、widthstylecolor背景(Backgrounds)背景的属性如下、background-color、#f00background-image、url(background.gif)background-repeat、no-repeatbackground-attachment、fixedbackground-position、00可以缩写为一句、background、#f00url(background.gif)no-repeatfixed00语法是background、colorimagerepeatattachmentposition你可以省略其中一个或多个属性值,如果省略,该属性值将用浏览器默认值,默认值为、color、transparentimage、nonerepeat、repeatattachment、scrollposition、0%0%字体(fonts)字体的属性如下、font-style、italicfont-variant、small-capsfont-weight、boldfont-size、1emline-height、140%font-family、"LucidaGrande",sans-serif可以缩写为一句、font、italicsmall-capsbold1em/140%"LucidaGrande",sans-serif注意,如果你缩写字体定义,至少要定义font-size和font-family两个值。
22、列表(lists)取消默认的圆点和序号可以这样写list-style、nonelist的属性如下、list-style-type、squarelist-style-position、insidelist-style-image、url(image.gif)可以缩写为一句、list-style、squareinsideurl(image.gif)明确定义单位,除非值为0忘记定义尺寸的单位是CSS新手普遍的错误。
23、在HTML中你可以只写width=但是在CSS中,你必须给一个准确的单位,比如、width、100pxwidth、100em。
24、只有两个例外情况可以不定义单位、行高和0值。
25、除此以外,其他值都必须紧跟单位,注意,不要在数值和单位之间加空格。
26、区分大小写当在XHTML中使用CSS,CSS里定义的元素名称是区分大小写的。
27、为了避免这种错误,我建议所有的定义名称都采用小写。
28、class和id的值在HTML和XHTML中也是区分大小写的,如果你一定要大小写混合写,请仔细确认你在CSS的定义和XHTML里的标签是一致的。
29、取消class和id前的元素限定当你写给一个元素定义class或者id,你可以省略前面的元素限定,因为ID在一个页面里是的,class可以在页面中多次使用。
30、你限定某个元素毫无意义。
31、例如、div#id1{}可以写成#id1{}这样可以节省一些字节。
32、默认值通常padding和margin的默认值为0,background-color的默认值是transparent。
33、但是在不同的浏览器默认值可能不同。
34、如果怕有冲突,可以在样式表一开始就先定义所有元素的margin和padding值都为0,象这样、*{padding、0margin、0}或者是针对某元素来定义、ul,li,div,span{padding、0margin、0}CSS的优先级行内样式(inlinestyle)ID选择符样式(class),伪类(pseudo-class)和属性(attribute)选择符类别(type),伪对象(pseudo-element)解释、*内联样式(inlinestyle)、元素的style属性,比如divstyle="color、red"/div,其中的color、red就是行内样式*ID选择符、元素的id属性,比如div/div可以用ID选择符#content*伪类(pseudo-class)、常见的是锚(a)伪类,比如a、link,a、visited.*属性选择符(attributeselectors)、比如div(class=demo),含有class为demo的div元素*类别选择器(typeselector)、HTML标签选择,比如div.demo,div元素下含有class为demo的元素*伪对象选择器(pseudo-elementselector)、比如div、first-letter,div元素下的第一个单词。
35、不需要重复定义可继承的值CSS中,子元素自动继承父元素的属性值,象颜色、字体等,已经在父元素中定义过的,在子元素中可以直接继承,不需要重复定义,除非是为了更变当前元素样式不使用父元素的属性值,但是要注意,浏览器可能用一些默认值覆盖你的定义。
36、多重CSS样式定义,属性追加重复后优先原则一个标签可以同时定义多个class,也可以是同一个class中重复定义属性。
37、例如、我们先定义两个样式.one{width、200pxbackground、url(jpg)no-repeatlefttop}.two{border、10pxsolid#000background、url(jpg)no-repeatlefttop}在页面代码中,我们可以这样调用、divclass="one"two/div这样终的显示效果是这个div样式是什么呢??重复的是以哪一个为准呢??divclass="one"two/div应用到的样式如下、width、200pxborder、10pxsolid#000background、url(jpg)no-repeatlefttop因为,当应用两个或多个样式时,浏览器所应用的样式根据是属性追加重复后优先原则就是说两个或多个或重复的样式名定义,浏览器所应用的样式是按先后顺序的,如果定义了重复的属性值,以后定义的为准,如果应用了两个或多个样式名,里面不重复定义的属性值就追加上去,重复的属性值就以后一个为准。
38、这里要注意的是,样式的先后不是根据页面上应用的名字顺序,而是样式表里的样式顺序。
39、使用子选择器(descendantselectors)使用子选择器是影响他们效率的原因之一。
40、子选择器可以帮助你节约大量的class定义。
41、我们来看下面这段代码、divulliclass="subnavitem"ahref=liclass="subnavitemselected"ahref="liclass="subnavitem"ahref="/ul/div这段代码的CSS定义是、div#subnavul{}div#subnavulli.subnavitem{}div#subnavulli.subnavitema.subnavitem{}div#subnavulli.subnavitemselected{}div#subnavulli.subnavitemselecteda.subnavitemselected{}你可以用下面的方法替代上面的代码ulid=”subnav”liahref="liclass="sel"ahref="http、/wlci.com.cn/#"Item1/a/liliahref="/ul样式定义是、#subnav{}#subnavli{}#subnava{}#subnav.sel{}#subnav.sela{}用子选择器可以使你的代码和CSS更加简洁、更加容易阅读。
42、如果一个容器里有多个同样的元素,而且这些元素样式都不一样,请避免用这个方式,建以采用不同的class如、ulclass=”one”li/li/ululclass=”tow”li/li/ul不需要给背景图片路径加引号为了节省字节,我建议不要给背景图片路径加引号,因为引号不是必须的。
43、例如、background-image、url(“imagesmargin、0auto}但是IE5/Win不能正确显示这个定义,我们采用一个有用的技巧来解决、用text-align属性。
44、就象这样、body{text-align、center}#wrap{width、760pxmargin、0autotext-align、left}第一个body的text-align、center规则定义IE5/Win中body的所有元素居中(其他浏览器只是将文字居中),第二个text-align、left是将#warp中的文字居左。
45、导入(Import)和隐藏CSS因为老版本浏览器不支持CSS,一个通常的做法是使用@import技巧来把CSS隐藏起来。
46、例如、@importurl(main.css)然而,这个方法对IE4不起作用,这让我很是头疼了一阵子。
47、后来我用这样的写法、@importmain.css这样就可以在IE4中也隐藏CSS了,呵呵,还节省了5个字节呢。
48、想了解@import语法的详细说明,可以看这里《centricle’scssfilterchart》CSShack有些时候,你需要对IE浏览器的bug定义一些特别的规则,这里有太多的CSS技巧(hacks),我只使用其中的两种方法,不管微软在即将发布的IE7beta版里是否更好的支持CSS,这两种方法都是安全的。
49、注释的方法(a)在IE中隐藏一个CSS定义,你可以使用子选择器(childselector)、htmlbodyp{}(b)下面这个写法只有IE浏览器可以理解(对其他浏览器都隐藏)*htmlp{}(c)还有些时候,你希望IE/Win有效而IE/Mac隐藏,你可以使用反斜线技巧、*htmlp{declarations}(d)下面这个写法只有IE7浏览器可以理解(对其他浏览器都隐藏)*+htmlp{}条件注释(conditionalcomments)的方法另外一种方法,我认为比CSSHacks更加经得起考验就是采用微软的私有属性条件注释(conditionalcomments)。
50、用这个方法你可以给IE单独定义一些样式,而不影响主样式表的定义。
51、就象这样、。
52、--(ifIE)linkrel=stylesheet/csshref="。
53、(endif)--还有更多的CSShack大家可以通过网上找找,但是有很多hack都是不符合w3c标准的,本人根据以上的hack写了一个能区分IEIEFF的样式,而且可以符合w3c标准,代码如下、.classname{width、90px。
54、importantwidth、100px}*+html.classname{width、95px。
55、important}这样写后在IE6下宽是100px,IE7下是95px,火狐下是90px。
56、调试技巧、层有多大?当调试CSS发生错误,你就要象排版工人,逐行分析CSS代码。
57、我通常在出问题的层上定义一个背景颜色,这样就能很明显看到层占据多大空间。
58、有些人建议用border,一般情况也是可以的,但问题是,有时候border会增加元素的尺寸,border-top和boeder-bottom会破坏纵向margin的值,所以使用background更加安全些。
59、另外一个经常出问题的属性是outline。
60、outline看起来象boeder,但不会影响元素的尺寸或者位置。
61、只有少数浏览器支持outline属性,我所知道的只有Safari、OmniWeb、和Opera。
62、CSS代码书写样式在写CSS代码的时候,对于缩进、断行、空格,每个人有每个人的书写习惯。
63、在经过不断实践后,我决定采用下面这样的书写样式、.classname{width、100px}当使用联合定义时,我通常将每个选择器单独写一行,这样方便在CSS文件中找到它们。
64、在后一个选择器和大括号{之间加一个空格,每个定义也单独写一行,分号直接在属性值后,不要加空格。
65、我习惯在每个属性值后面都加分号,虽然规则上允许后一个属性值后面可以不写分号,但是如果你要加新样式时容易忘记补上分号而产生错误,所以还是都加比较好。
66、后,关闭的大括号}单独写一行。
67、空格和换行有助与阅读。
三、问句css list-style-type: none;1、kklkklkklkklkkl自己把类别改一下看有什么效果。
四、怎样在八卦符号旁边添加标记小圆点1、kklkklkklkklkkl自己把类别改一下看有什么效果。
五、list-style-type:none这个在css里是什么意思1、在CSS中,list-style-type是一个用来指定列表项标记类型的属性。
2、比如,您可以使用这个属性来指定列表项标记是圆点、方块还是数字。
3、如果您将这个属性设置为none,则会使列表项没有标记,也就是说,列表项之间将没有任何显示。
六、CSS的display属性list-item的list-style-type显示不出来1、你好,很高兴为您解答。
七、关于定义CSS中的代码意思1、你好,很高兴为您解答。