html css

来源:互联网 发布:医学统计常用那些软件 编辑:程序博客网 时间:2024/05/21 09:27

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、如果内容部分的标签高度不会再变化的话,那么算准内部标签的高度后,再直接给父级设定高度就好了。

0 0
原创粉丝点击