解决标题过长的CSS

不知道为什么大家用截取字符串的人很多呢。。

<html>
<head>
<style type="text/css">
.divout {
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    width: 100%;
    overflow: hidden;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
    text-overflow: ellipsis;
}
</style>

</head>
<body>
<div class="divout" style="width:100px;">
源码爱好者为您提供精品的网页特效、网页教程,还有面向初学者的各类编程代码,助您早日成功编程高手。
</div>
</body>
</html>

多好用的代码,IE 谷歌全兼容。。

解决标题过长的CSS

时间: 2024-11-26 02:13:09

解决标题过长的CSS的相关文章

2017-3-14文章名 css解决标题背景 不显示文字

2017-3-14文章名 css解决标题背景 不显示文字 标签 text-indent: 100%; white-space: nowrap; overflow: hidden; 隐藏文字 以图代字

css:文章标题过长时,使用省略号

html代码 <ul> <li><a href="" target="_blank">我是文章1,现在标题过长,使用css加省略号</a></li> <li><a href="" target="_blank">文章2</a></li> <li><a href="" target=&

使用CSS处理标题过长,自动截断,兼容响应式布局

应用场景描述 例如PHP 从数据库读取一个商品,那么当商品标题很长的时候,很可能会影响页面布局.处理方法如下: PHP 字符串截取 JS 字符串截取 CSS 属性处理(推荐) CSS 属性处理方法 html代码片段 <li > <span class="cut">商品标题商品标题商品标题商品标题商品标题商品标题</span> <span style="float: right;">9秒前</span> &l

解决浏览器显示长数字不能自动换行或长字母不能换行的问题

原文:解决浏览器显示长数字不能自动换行或长字母不能换行的问题 首先看一下是什么问题: 例如: 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111

python之ddt模式随记三,ddt模式用例标题过长解决

背景: 使用python+unittest+ddt+excel模式做接口测试时,ddt数据驱动时出现了一个尴尬的问题,大概就是在用ddt数据时,会驱动不同的数据去调用被装饰的函数,然后出现了标题也附带上了value. 直接上问题图 直接上问题原因代码: import ddt import unittest ## 数据源 data = { 'api1': [ ['2', ['checkcode', '{\n "a":"1",\n "b":"

css截取字符串,实现标题过长用。。。。代替

list .ad_title { float: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 220px; } 效果如图:

Gulp解决发布线上文件(CSS和JS)缓存问题

本文的缘由:目前经常线上发布文件后要不断的刷新页面及过很长时间,页面上的CSS和JS文件才能生效,特别对于目前做微信商城的时候,微信内置的浏览器缓存非常的严重,之前我们经常是在文件后面加上时间戳的方式来解决线上发布后的缓存问题,但是在微信浏览器内并不生效:因此我们需要改变文件名的方式来解决缓存的问题,因此使用后缀名加上MD5一连串的字符串来解决缓存的问题: 我们先可以考虑这么一个功能,我在页面上引用css文件如下: ./css/xx.css ./js/xx.js 我现在想通过使用MD5重新命名c

解决Chrome谷歌浏览器不支持CSS设置小于12px的文字

在最新版的谷歌里.已经不在支持这个属性啦 谷歌浏览器Chrome是Webkit的内核,有一个 -webkit-text-size-adjust 的私有 CSS 属性,通过它即 可实现字体大小不随终端设备或浏览器影响.CSS样式定义如下:-webkit-text-size-adjust:none; 如何让谷歌浏览器支持小于12px的字体 经常与网页打交道的攻城师,应该都知道.谷歌不支持小于12px的字体.网页解决方案很多.比如.修改浏览器配置.修改浏览器语言.但作为一个WEB,我们无法修改用户的浏

解决bootstrap和easyUI部分css类冲突问题。

今天发现bootstrap和easyui的css类重复用了一个很笨的办法解决了,这种小事网上都不好搜啊. 我先引用的bootstrap后引用的easy UI,bootstrap的会被覆盖,boot的样式不正常就是难看了点,easy UI的有问题页面就直接不能看了,所以还的easy UI放后面,我又增加了个人mybootstrap.css,吧bootstrap被覆盖的重命名复制过去就互不冲突了. 比如:吧所有的panel替换成b-panel存到mybootstrap.css,引用的时候用b-pan