html笔记

[回忆]html常见问题，通过历史笔记整理。有些可能真的成为历史了。

超链接访问过后hover样式就不出现的问题

1
2
3

被点击访问过的超链接样式不在具有hover和active了,很多人应该都遇到过这个问题,解决方法是改变CSS属性的排列顺序: L-V-H-A 
<style type="text/css">
<!-- a:link {} a:visited {} a:hover {} a:active {}   -->      </style>

FireFox下如何使连续长字段自动换行

1	众所周知IE中直接使用 word-wrap:break-word 就可以了, FF中我们使用JS插入的方法来解决

Ff下为什么父容器的高度不能自适应

1	在子容器加了浮动属性后,该容器将不能自动撑开,解决方法是在标签结束后加上一个清除浮动的元素。clear:both;

Li中内容超过长度后以省略号显示

1
2
3

<style type="text/css">      
 <! -- li { width: 200px; white-space:nowrap; text-overflow:ellipsis;  -o-text-overflow:ellipsis; overflow: hidden;  }  -->
</style>

垂直居中文本

将元素高度和行高设为一致。
<style type="text/css">
<!--    div{    height:30px;   line-height:30px;   border:1px solid red }   -->  
</style>

如何对齐文本与文本输入框

1	<!-- input { width:200px; height:30px; border:1px solid red; vertical-align:middle-->

怎样使一个层垂直居中于浏览器

这里我们使用百分比绝对定位,与外补丁负值的方法,负值的大小为其自身宽度高度除以二 
 div { 
 position:absolute;
 top:50%;
 left:50%;
 margin:-100px 0 0 -100px;
 width:200px; 
 height:200px;
 border:1px solid red;
 }

图片垂直与容器内

1	使用背景图的办法: background:url("logo.gif") center no-repeat;