前端实现div框边角的钝化虽然简单，但是有时候突然想不到，特此写下几句实现方法，以便记忆。
实现div框四个角都钝角的操作：设置 div ： border-radius=10px;
实现div框一个角的钝角效果 ：设置div :border-top-left-radius=10px;
border-top-right-radius=10px;
border-bottom-left-radius=10px;
border-bottom-right-radius=10px;
html实现限制一行字数的显示，超出的部分用省略号（....）来代替
white-space:nowrap; overflow:hidden; text-overflow:ellipsis; border:1px solid red"> 试试看试试看试试看试试看试试看试试看试试看试试看试试看试试看试试看 </div><div style="width:200px;
语法：
text-overflow : clip | ellipsis
参数：
clip : 不显示省略标记（...），而是简单的裁切（clip这个参数是不常用的！）
ellipsis : 当对象内文本溢出时显示省略标记（...）
说明：
设置或检索是否使用一个省略标记（...）标示对象内文本的溢出。
请您注意，text-overflow:ellipsis属性在FF中是没有效果的。
示例：
div { text-overflow : clip; }
text-overflow是一个比较特殊的样式，我们可以用它代替我们通常所用的标题截取函数，而且这样做对搜索引擎更加友好，如：标题文件有50 个汉字，而我们的列表可能只有300px的宽度。如果用标题截取函数，则标题不是完整的，如果我们用CSS样式text- overflow:ellipsis，输出的标题是完整的，只是受容器大小的局限不显示出来罢了。
text-overflow属性仅是注解，当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。我们想要实现溢出时产生省 略号的效果。还必须定义：强制文本在一行内显示（white-space:nowrap）及溢出内容为隐藏（overflow:hidden）。只有这样 才能实现溢出文本显示省略号的效果。
有的时候的某段文本太长了，会影响整个的布局，很多人用动态语言来解决这个问题，但必须区分中文和英文，因为中文相当于两个英文字符长度，这样不仅繁琐，而且加重了服务器的负担。其实，我们完全可以使用CSS完美解决这个问题，
如何实现CSS限制字数,超出部份显示点点点...
<div style="width:200px; white-space:nowrap;overflow:hidden;text-overflow:ellipsis; border:1px solid red">试试看试试看试试看试试看试试看试试看试试看试试看试试看试试看试试看</div>
效果：
语法：
text-overflow : clip | ellipsis
参数：
clip : 不显示省略标记（...），而是简单的裁切
（clip这个参数是不常用的！）
ellipsis : 当对象内文本溢出时显示省略标记（...）
说明：
设置或检索是否使用一个省略标记（...）标示对象内文本的溢出。
请您注意，text-overflow:ellipsis属性在FF中是没有效果的。
示例：
div { text-overflow : clip; }
text-overflow是一个比较特殊的样式，我们可以用它代替我们通常所用的标题截取函数，而且这样做对搜索引擎更加友好，如：标题文件有50 个汉字，而我们的列表可能只有300px的宽度。如果用标题截取函数，则标题不是完整的，如果我们用CSS样式text- overflow:ellipsis，输出的标题是完整的，只是受容器大小的局限不显示出来罢了。
text-overflow属性仅是注解，当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。我们想要实现溢出时产生省 略号的效果。还必须定义：强制文本在一行内显示（white-space:nowrap）及溢出内容为隐藏（overflow:hidden）。只有这样 才能实现溢出文本显示省略号的效果。
有的时候的某段文本太长了，会影响整个的布局，很多人用动态语言来解决这个问题，但必须区分中文和英文，因为中文相当于两个英文字符长度，这样不仅繁琐，而且加重了服务器的负担。其实，我们完全可以使用CSS完美解决这个问题，
white-space:nowrap;overflow:hidden;text-overflow:ellipsis; <!-- 就这三句,,,嘿嘿....->
发布此文章仅为传递网友分享，不代表本站观点，若侵权请联系我们删除，本站将不对此承担任何责任。 旅行，写作，编程鲜为人知的编程真相Java 与 .NET 的平台发展之争我的丈夫是个程序员中国软件开发者薪资调查报告科技史上最臭名昭著的13大罪犯程序员的鄙视链做程序猿的老婆应该注意的一些事情HTML/CSS-热门 HTML/CSS-最新 HTML/CSS-其它 1CSS经典布局之弹性格局2html例证3bootstrap-组件之旋钮式下拉菜单4div均匀分布代码范例5相关Node、Element，HTMLCollection、NodeList6CSS/CSS3惯用样式小结7【HTML】仿淘宝五星评估显示任何分数8input文本框实现宽度自适应代码范例，input文本框9Gulp帮你自动搞定coffee跟scss的compile10超市导航代码上一篇：html form onsubmit函数解释，input、submit、button的差异下一篇：CSS进度条展示
