1.显示文本宽度固定且不换行,溢出用省略号代替的代码:
比如li标签
<li><i></i><a target="_blank" title="王树增:军人的爱国情怀是时刻准备着报效祖国,为国献身" href="http://theory.people.com.cn/n/2014/0218/c40531-24390807.html">王树增:军人的爱国情怀是时刻准备着报效祖国,为国献身</a>
</li>
css可以这样写:
li{white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height:24px;*width:320px;}
white-space 属性设置如何处理元素内的空白。
normal 默认。空白会被浏览器忽略。
pre 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
nowrap 文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。
pre-wrap 保留空白符序列,但是正常地进行换行。
pre-line 合并空白符序列,但是保留换行符。
inherit 规定应该从父元素继承 white-space 属性的值。
分享到:
相关推荐
css用法总结来自sister
CSS用法总结,介绍了css基本语法、盒子模型、选择器等等,还介绍与html文档结合使用的方式,通过css的使用实现Html显示页面更加美观,另外附带CSS的参考文档(帮助文档)。
这篇博客"CSS常用样式总结积累"是博主对CSS的一些核心概念和技术进行的归纳,旨在帮助读者理解和掌握CSS的基本用法。以下是对这些知识点的详细解释: 1. **选择器**: CSS选择器是匹配HTML元素的方式,如类选择器(`...
【关于div+css的用法总结】 随着网页设计技术的发展,传统的table布局方式逐渐被淘汰,取而代之的是更加灵活和可维护的div+css布局。这种布局方式强调内容与样式的分离,使得网页设计更加模块化,易于适应不同的...
**使用方法**: 要在项目中使用Postcss-css-variables,首先需要安装PostCSS及其插件,通常会借助像webpack、Gulp或Grunt这样的构建工具。然后,在PostCSS配置文件中,将`postcss-css-variables`添加到插件列表中。...
"HTML+CSS总结" ... ...我们只需使用鼠标在某一文档中点取一个图标,Internet 就会马上转到与此图标相关的...定位的方法是在 CSS 中设置容器的 top、bottom、left 和 right 值,这 4 个值得参照对象是浏览器窗口或父容器。
解决这个问题的方法包括使用跨浏览器的CSS重置(如 Normalize.css 或 Eric Meyer Reset),使用浏览器前缀(如 `-webkit-`, `-moz-` 等)以及利用CSS hack。 2. **文字排版**:CSS提供了丰富的属性来调整文本的样式...
通过阅读“Css hack总结及其最佳用法,告诉你怎么运用hack,无懈可击的解决各个浏览器的样式兼容 - 毛绒猫猫 - 博客园.htm”这篇文章,你将能更深入地理解CSS Hack,并学会如何在实际项目中有效应用它们。
### CSS学习总结 #### 一、CSS选择器与样式应用 **1. 行内样式** 行内样式是在HTML元素内部直接使用`style`属性来指定样式规则的方式。这种方式适用于临时性的样式修改,但不利于代码的维护和复用。 **示例**: ...
本篇文章将深入探讨如何利用CSS实现无图片的圆角效果,以及在各种场景下创建圆角区块容器和圆形边框的方法。 一、CSS圆角基础 CSS3引入了`border-radius`属性,它允许我们为元素的四个角设定不同的圆角半径,从而...
在网页设计领域,CSS(Cascading Style Sheets)是一种至关重要的技术,用于定义HTML或XML...以上就是CSS样式方法的全面总结,熟练掌握这些概念和技巧,将助你在网页设计中游刃有余,打造美观且功能丰富的用户体验。
CSS知识点总结中包含了关于CSS3的基础概念和属性应用的详细说明。CSS,全称为层叠样式表(Cascading Style Sheets),是一种用于描述HTML或XML(包括各种XML方言,如SVG或XHTML)文档的样式的语言。下面将详细介绍...
在网页设计中,CSS(层叠样式表)是用于控制网页元素外观的重要工具,而JavaScript则赋予了网页交互性。本篇文章将详细讲解如何利用CSS和JavaScript实现图像的移动、透明效果以及获取图像的位置信息,以创建丰富的...
本文档提供了CSS的基础语法与一些常用的属性介绍,包括如何引入样式、选择器的使用方法以及各种CSS属性的具体解释。通过这些基础知识的学习,可以更好地理解和掌握CSS的用法,从而更加灵活地控制网页的布局和样式。...
### CSS+DIV编写经验总结之CSS样式小模板 #### 概述 随着互联网技术的不断发展,Web前端设计已经成为了一个至关重要的领域。对于前端开发者来说,掌握CSS+DIV布局技巧是必不可少的一项技能。本文将根据提供的内容...
--*-- --*-- 1 单元目标 2 教学内容 3 动手实践 4 课堂小结 掌握层叠样式表的使用方法 能力目标 CSS的定义和基本语法 知识目标 《CSS网页样式设计与制作》 参考资料 单元目标 2 教学内容 1 单元目标 3 动手实践 4 ...
总结以上内容,CSS架构方法的采用可以帮助我们构建更加模块化和可维护的前端代码。OOCSS、SMACSS和BEM是三种流行的架构方法,它们各自提供了一套策略来组织和管理CSS代码,帮助开发人员解决样式冲突、提高代码复用性...
在当今的Web开发中,编写高效、可维护且具备组件化的CSS...5. 优化CSS性能,如通过压缩、使用CSS Lint工具等方法。 通过遵循以上建议,无论是新手还是追求优化性能的同学,都能够编写出更加高效且易于维护的CSS代码。
在"CSS RESET个人总结"中,我们将深入探讨这个主题。 一、为何需要CSS Reset 1. 浏览器差异:不同的浏览器对HTML元素的默认样式处理不一,如字体大小、行高、内边距、外边距等,这会导致页面在不同浏览器上的显示...