您的位置：首页 > Web前端 > CSS

html css

2016-01-11 09:06 519 查看

1.HTML超出文本显示省略号…[text-overflow]

需要对div或者span同时应用Css：

-o-text-overflow:ellipsis;

text-overflow:ellipsis;

white-space:nowrap;

overflow:hidden;

引用自：http://blog.csdn.net/jcx5083761/article/details/8538071

多行溢出的处理：

.overflowTwoLine{
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient: vertical;
}

自动高度

<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>自动高度</title>

<style type="text/css">
.container{
background-color: silver;
width:100%;
position:relative;
overflow:hidden;
}

.dummy{
margin-top: 75%;
}

.content{
position:absolute;
left:0;
right:0;
top:0;
bottom: 0;
}
</style>
</head>

<body>
<div style="width:50%;">
<div class='container'>
<div class='dummy'></div>
<div class='content'>
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
contentcontentcontentcontentcontentcontentcontentcontent
</div>
</div>
</div>

</body>
</html>

只显示右侧滚动条：

.table-wrapper
{
overflow-x:hidden;
overflow-y: scroll;
}
<div class="table-wrapper">
</div>

符號

“☑”;

“口”;

“√”;

#

两个都是设置的左浮动，为什么DIV边框不见了？

解決方法：

1、再父级标签上也就是加了边框的这个标签设定overflow:hidden;

2、给父级标签也加上float: left;

3、如果内容部分的标签高度不会再变化的话，那么算准内部标签的高度后，再直接给父级设定高度就好了。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航