html学习笔记

最新推荐文章于 2023-01-12 15:14:08 发布

willeager

最新推荐文章于 2023-01-12 15:14:08 发布

阅读量102

点赞数

分类专栏： html 文章标签： HTML CSS IE Firefox XHTML

本文链接：https://blog.csdn.net/willeager/article/details/83806711

版权

html 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

1.TD、DIV中的内容不超宽度自动换行

word-break:break-all;word-wrap:break-word;

2.DIV自适应高度，定义width和float属性

3.一像素表格边框

<table width="100%" height="100" border="1" bordercolor="blue" cellspacing="0" style="border-collapse:collapse">
<tr> <td>www.blueidea.com</td> <td>www.blueidea.com</td> </tr>
<tr> <td>www.blueidea.com</td> <td>www.blueidea.com</td> </tr>
</table

4.UL无序列表、OL有序列表、LI列表项

li之所以默认不能放在一行因为他是块结构元素你把他改成内联元素他就会在一行了
li的样式中加:display:inline; 就是让li以内联的方式显示

或者使用ul,li{list-style-type:none;}也可以

5. BOX模型在firefox和IE中的解释相差2px的解决方法
div{margin:30px !important ; margin:28px;}

现在进行WEB重构的时候,一般我们做DIV 居中是这样:
body{
margin:0px auto;
text-align:center;
}
但是在没申明下面这句解析方法的时候,页面就会出错.不能居中对齐!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

另一种兼容方法

<style type="text/css">
/*去除body的内外填充和border*/
body{
border:0 none;
margin:0;/*外填充*/
padding:0;
background-color: #FFF;
}
p{
margin:0; /*去掉外填充，否则FF下外填充会向外透滲,外填充会穿透外层，是透明的但占用空间，
2个P的margin重叠不多占空间*/
}
#page {
background-color:#AABFAA;
margin:0 auto; /*设置上下外填充为0,左右自动（居中）*/
overflow:visible;
width:950px;
}
</style>
</head>
<body>
<div id="page">
<p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p>
<p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p>
<p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p>
<p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p>
<p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p>
<p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p>
</div>
</body>

6.CSS中的布局属性的理解

display div:block（此元素将显示为块级元素，前后会带有换行符。） span:inline

float:相对于父元素的浮动设置了float为left或者right的元素A的display属性自动转为block

***跟随浮动对象的对象B将移动到浮动对象A的位置(暂时理解为float对象A前后不换行了)。

假如在一行之上只有极少的空间可供浮动元素A，那么这个元素A会跳至下一行

clear:B设置了clear:both 为B增加上外边距(***)。这样B才能位于A的下外边距边界之下

http://www.cnblogs.com/woodfish1988/archive/2007/03/01/660335.html

willeager

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
html学习笔记

1.TD、DIV中的内容不超宽度自动换行 word-break:break-all;word-wrap:break-word;2.DIV自适应高度，定义width和float属性3.一像素表格边框&lt;table width="100%" height="100" border="1" bordercolor="blue" cellspacing="0" style="b
复制链接

扫一扫

专栏目录