css前端笔记.doc

1. Html 与xhtml的区别 答：所有标签都是小写。标签成双成对。标签顺序正确。所有属性必须用引号。不许用target，用rel。 2 CSS的伪类 答：锚伪类a:link{未被访问}，a：visit{已访问}，a:hover{悬停在选项上}，a:active{选定的访问链接} Css2：first-child伪类（:first-child 伪类来选择元素的第一个子元素html head style type=text/css p i:first-child { font-weight:bold; } /style /head body psome itext/i. some itext/i./p psome itext/i. some itext/i./p /body /html 匹配第一个p元素的第一个i元素，这个符号的写法。如果p:first-child i{}这是匹配第一个p元素的所有i元素。 Css2：lang伪类 body p文字q lang=no段落中的引用的文字/q文字/p /body/html style type=text/css q:lang(no) { quotes: ~ ~ } /style 3 margin 上右下左，顺时针。margin-left：auto； margin-right：auto；达到水平居中。 4 ie盒子模型bug 　关于混杂模式和标准模式：如果页面没有声明!DOCTYPE则所有浏览器默认都会开启混杂模式。因此建议编写页面时都加上doctype声明，最简单的是声明为html5格式的，!DOCTYPE html这样页面就运行在标准模式下，不会出现ie的盒子模型bug了。 margin 折叠垂直方向上的不同元素的相邻的margin在某些情况下，会发生折叠的现象。比如，两个 div ，上下相邻，上面 DIV 的margin-bottom 会和 下面 DIV 的 margin-top 产生折叠的现象，两个重叠成一个，具体宽度取较大的。例如： XML/HTML code? 1 2 3 4 div style=background-color:green; width:100px; height:100px;margin-bottom:100px; /div div style=background-color:red; width:100px; height:100px; margin-top:50px; /div 上下两个 DIV 最终相距100px， 而不是 150px。 none 此元素不会被显示。 block 此元素将显示为块级元素，此元素前后会带有换行符。 inline 默认。此元素会被显示为内联元素，元素前后没有换行符。 inline-block 行内块元素。（CSS2.1 新增的值） list-item 此元素会作为列表显示。 run-in 此元素会根据上下文作为块级元素或内联元素显示。 h1 {text-decoration:overline} h2 {text-decoration:line-through}穿过 h3 {text-decoration:underline} h4 {text-decoration:blink}闪烁 8 line-hight 行高。 9辅助图片一律背景处理 BACKGROUND: url(../images/bg_logo.gif) #FEFEFE no-repeat right bottom; 尽管可以用直接插在内容中，但这是不推荐的。这里的辅助图片是指那些不是作为页面要表达的内容的一部分，而仅仅用于修饰、间隔、提醒的图片。例如：相册中的图片、图片新闻中的图片，上面的3d盒模型图片都属于内容的一部分，它们可以用元素直接插在页面里，而其它的类似logo，标题图片，列表前缀图片都必须采用背景方式或者其他CSS方式显示。 10 css定位position static 元素框正常生成。块级元素生成一个矩形框，作为文档流的一部分，行内元素则会创建一个或多个行框，置于其父元素中。 relative 元素框偏移某个距离。元素仍保持其未定位前的形状，它原本所占的空间仍保留。 absolute 元素框从文档流完全删除，并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭，就好像元素原来不存在一样。元素定位后生成一个块级框，而不论原来它在正常流中生成何种类型的框。 fixed 元素框的表现类似于将 position 设置为 absolute，不过其包含块是视窗本身。 Trident: IE 以Trident 作为内