大史哥哥

无标题文档body, ul { margin: 0; padding: 0;}li { list-style: none;}a { text-decoration: none;}body { background-color: #23232f; padding: 20px;}.nav { background: #0f0f14 url(img/navL.png)

Document body{height: 2000px;} .box1{width: 300px;height: 100px;background: red;position: absolute;right: 0;bottom: 0;} /*固定定位：以当前可视文档为基准→→跟随滚动条移动，不以最近父级定位元素为基准*/ .father{width: 400px;height: 40

无标题文档 * { margin: 0; padding: 0;}img { border: none;}table { border-collapse: collapse;}body { background: #ffffff;}form { width: 522px; height: 575px; margin: 50px auto;}form tab

Document /* 1.元素设置position:absolute后，元素脱离文档流 2.元素设置position:absolute后，元素具有float的特性 3.元素设置position:absolute后，元素以最近的已设置position属性的父级元素为基准进行偏移；如没有符合条件的父级元素，则以整个文档为基准 4.层级用z-index:[number]设置，数

Document a{text-decoration: none;} .wrap{width: 300px;height: 300px;padding: 10px;border: 2px solid black;margin: 50px auto;position: relative;} .wrap a{width: 100px;background: #00bcff;height:

Document div{width: 200px;height: 100px;} .box1{width: 100px;background: red; position: relative;top: 100px;left: 100px;} .box2{background: green;} .box3{background: blue;}

Document body{margin: 0;} ul{margin: 0;padding: 0;list-style: none;} a{text-decoration: none;} .list{width: 300px;} /* bug:当li内元素浮动后，li之间出现间隙。 解决方法：如下注释部分。 */ .list li{height:

Document.box{width: 400px;}/*div.right加浮动前，文字会与div.left有3px间隔*//*需求：几个div并在一排；解决：div.left浮动后，div.right也加浮动*/.left{width: 100px;background: red;height: 500px;float: left;}.right{width: 300p

Document /* bug：当元素高度小于19px，会被当做19px处理。 解决方法：如下注释部分。 */ .box{height: 1px;background: blue;/*overflow: hidden;*/}

Document body{margin: 0;} .cover{width: 100%;background: black; height: 100%;position: absolute;top: 0;left: 0;} /*滤镜*/ .cover{opacity: 0.5;} /*兼容IE7、8*/ .cover{filter:alpha(opacity:50);} /*

1.相对定位bug：

Document body{margin: 0;} /*去单元格间隙*/ table{border-collapse: collapse;width: 566px;height: 300px;text-align: center; } /*重置默认样式*/ th,td{padding: 0; border: 1px solid black;}

无标题文档.menu { width: 221px; background: black;}/*btn不平铺，且拉伸。局限性：为导航选项宽度过大时，有缝隙。*/.btn { width: 71px; background:url(img/btnM.png) no-repeat; float: left; margin-left: 2px;}/*btnL删除*/.btnR

无标题文档.menu { width: 221px; background: black;}.btn { width: 71px; background: url(img/btn.png) repeat-x; float: left; margin-left: 2px;}.btnL { background: url(img/btnL.png) no-repeat;}

无标题文档body { margin: 0 auto;}img { border: none;}table { border-collapse: collapse; font: 12px 宋体; color: #333333;}th,td{padding: 0;}select,button{ margin: 0;}.all { width: 720px; mar

使用table来布局的演示* { margin:0; padding:0;}table { border-collapse:collapse;}input,select { font-family:Arial, Helvetica, sans-serif; font-size: 12px;}.required { font:0.8em Ver

无标题文档*{ margin: 0; padding: 0; }table{ border-collapse:collapse;}th{ font-weight:normal;}form{ margin:50px auto; width: 600px; height: 625px; font-family:宋体;}/*控制列宽*/form table .col1{ width:

无标题文档 /*默认样式重置*/ input{padding: 0;margin: 0;} .inputPic{width: 300px;height: 30px;border: 1px solid red; background: url(images/Pic.png) 0 center no-repeat; } .divPic{width: 300px;height: 30px

无标题文档<!--默认样式重置--> input {padding: 0;margin: 0;}select { margin: 0;}textarea { padding: 0; margin: 0;}form { width: 700px; height: 650px; border: 1px solid black;}span { border:

Document body { margin: 0;}img { border: 0;}table { border-collapse: collapse;}th, td { padding: 0;}.wrap { width: 385px; height: 272px;}.wrap .tit { width: 383px; height: 26px; b

Document body{margin: 0;} .wrap{float: left;border: 10px solid red;background: yellow;} /* bug：当子块级元素有浮动且有横向margin值时，子块级元素在浮动方向的margin值，扩大两倍。 解决方法：如下注释部分↓↓ */ .box{float: left;wid

Document body{margin: 0 auto;} .main{width: 900px;margin: 0 auto;} .main .left{width: 300px;float: left;} .main .left div{height: 298px;background: green;border: solid 1px blue;} .main .ce

img{ width: 200px; height: 250px; } img标签使用src属性调用图片地址 当src地址写错时，如下图所示：（图片挂掉，并在图片上显示alt的属性值）

1.常见文本样式对比 我是正常的，我是正常的。 我是正常的，我是正常的。 我是正常的，我是正常的。 我是正常的，我是正常的。 我是正常的，我是正常的。 我是正常的，我是正常的。 我是正常的，我是正常的。 我是正常的，我是正常的。

第一个页面这是我的第一个页面

样式 /*内部样式表*/ #nbys{ width: 200px;height: 200px;background-color: green; } 这是一个box（被行间样式表控制） 这是另一个box（被内部样式表控制） 这是id为many的box，并且该.h

第一类：两个box同级 第一种： m1,无margin m2,无margin 第二种： m3,margin-botoom：10px m4,无margin 第三种： m5,无margin m6,margin-top：10px 第四种： m7,margin-bottom：10px m8,margin-top：10px 第五种：

1.设置border-style属性 2.只设置border-color、border-width属性（tip：如不设置border-type属性，默认为none） 3.设置border属性，完爆上面的属性 !!border属性有多个同类属性值时，其值遵循上、右、下、左的次序渲染。 4.设置上、右、下、左边框相同的属性 5.设置两类属性

1.默认背景 2.默认背景水平重复 3.默认背景垂直重复 4.默认背景不重复 （tip：如果水平、垂直任意一项规定了值，另一项为居中） 5.默认背景水平方向居左，垂直居下 6.默认背景垂直方向居上，水平居右 7.缩写

1.box：150*150 我是内容，我外面是box，嘿嘿。。 2.box：150*150........padding:30px 我是内容（我好像胖了30px，把box挤大了.....） 3.box：90*90..........padding：30px box，你回到原来那样吧..我还是想念原来那个你.. 尽管回到了原来，但是我们之间还是有了距离。。。

1.width2.height3.border4.background5.padding6.margin7.font-family8.font-size9.color10.font-weight11.font-style12.text-decoration13.text-indent14.letter-spacing15.word-spacing16.text-align17.line-heigh

本人所用为sublime编辑器。设置sublime编码格式：1.ctrl+alt+p 2.输入"settings-default" 3.查找"default_encoding"  4. 将其值改为"utf-8"

p{ text-indent: 2em; } span{ font-weight: bold; } 标题1 该文字在p标签内，标签内通常为段落。其中：1.对浏览器重要的信息用strong标签着重表示并显示为加粗。 2.次要的信息用em标签着重表示并显示为斜体。 标题2 一段文字中，如需要控制其中

Document body{margin: 0;} .main{width:906px;border:5px solid black;margin:0 auto;} .main::after{content: "";display:block;clear:both;} .left{float:left;width:250px;border: 1px solid red;}

Document img{width: 100px;height: 50px;} div{display: inline-block;width: 100px;height: 100px;background: red;} span{display: inline-block;width: 100px;height: 100px;background: blue; } 1

Document .a{width: 100px;height: 100px;background: red;float: left;} .a1{width: 50px;height: 50px;background: black;} .b{width: 200px;height: 200px;background: blue;} .b1{width: 120px;heig

Document /*块元素*/ body,h1,h6,p,dl,dd{margin: 0;} h1{width: 100px;height: 100px;background: red;} p{width: 100px;height: 100px;background: blue;} ul,ol{margin: 0;padding: 0;} ul{width:

Document div{display: block;} div,ul,li{margin: 0;padding: 0;} ul{ list-style: none;} .menu{ width: 990px;height: 44px;background: #BE0000; margin: 0 auto; } .menu li{float: left; heigh

Document body,h1,h2,h3,h4,h5,h6,p,dl,dd{margin:0;} ul,ol{list-style: none; padding: 0; margin:0;} img{border: none;} a{text-decoration: none;} strong标签 em标签 span标签 a标签

1.相同的选择器，在样式表内，后者会覆盖前者。