`

CSS实例(1):用CSS控制标题字数

阅读更多
标题字数不光是程序可以控制,而且也可以用CSS控制,以下是具体写法:
CSS------------------
.text{width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; course:hand; margin:0 auto;}

HTML----------------------
<div class="text">非常多的字数你能控制得了不可能的骗你是小狗</div>

-----------------------------------------------------------------------------------------------
注释说明:
white-space:normal      /*默认,空白忽略,具体效果是:如果字数超过宽度,会换行显示*/
                          pre           /*空白被浏览器保留,具体效果是:如果字数超过宽度,会换行但不会显示换行部分*/
                          nowrap     /*默认,空白忽略,具体效果是:不会换行*/

text-overflow:clip        /*无省略号,裁切*/
                          ellipsis   /*省略号标记*/

分享到:
评论

相关推荐

    JQuery&CSS;&CSS;+DIV实例大全.rar

    10.jQuery限制input或texteara字符输入限制字数控制插件下载 11.jQuery支持三级菜单的超酷华丽炫彩动感多级渐显菜单下载 12.jQuery制作登录按钮实现Ajax带状态提示 13.jvalidate无刷新表单验证插件示例下载 ...

    CSS网页实例:斜角滑动门导航条

    所以一边写代码,一边在改图,图片改的比较乱,CSS也没有优化; 但效果出来了; 写出来和大家分享一下; 首先说一下,要实现的目标: 滑动门,要兼容每个TAB可能出现的宽度(字数)不统一的问题; 后台程序实现...

    12个不错的DIV+CSS模板

    【标题】"12个不错的DIV+CSS模板"揭示了这个压缩包中包含了一系列基于HTML的网页设计模板,这些模板采用了流行的布局技术——DIV(Division)和层叠样式表(CSS)。DIV元素在HTML中被广泛用作布局容器,允许开发者...

    jquery表单验证实例,对数字,字数,必填项等校验

    在"jquery表单验证实例,对数字,字数,必填项等校验"这个项目中,我们关注的核心知识点包括: 1. **jQuery Validate插件安装与引入**:首先,你需要在HTML文件中引入`jQuery`库和`jQuery Validate`插件的JS文件。...

    jquery仿微博字数限制

    在本文中,我们将深入探讨如何使用jQuery来实现一个仿微博字数限制的功能。这个功能在许多社交媒体和在线论坛中非常常见,它可以帮助用户在输入文本时实时监测并限制字符数,确保符合平台的规定。 首先,我们需要...

    程序天下:JavaScript实例自学手册

    第1章 页面特效 1.1 HTML页面反向显示 1.2 页面自动最大化 1.3 页面自动刷新 1.4 页面的后退、刷新、前进 1.5保护网页源代码 1.6 保护自己的网页不被放入框架 1.7 保护自己的网页不被放入框架 1.8 打印页面的出错...

    《程序天下:JavaScript实例自学手册》光盘源码

    第1章 页面特效 1.1 HTML页面反向显示 1.2 页面自动最大化 1.3 页面自动刷新 1.4 页面的后退、刷新、前进 1.5保护网页源代码 1.6 保护自己的网页不被放入框架 1.7 保护自己的网页不被放入框架 1.8 打印页面的出错...

    仿微博提示可输入剩余字数

    这可能需要使用CSS媒体查询或者前端框架(如Bootstrap)的栅格系统。 8. **错误处理**:在实际应用中,需要考虑异常情况,如输入框为空或输入超出最大限制,此时应提供合理的错误提示。 通过以上技术的综合运用,...

    Vue实现动态显示textarea剩余字数

    这段CSS会让`span`元素与`textarea`保持适当的距离,并使用灰色字体显示剩余字数。 最后,当用户在`textarea`中输入字符时,`descInput`方法会自动更新`remnant`的值,从而实时显示剩余的字符数。这种方法简单有效...

    HTML5输入框字数限制提示代码.zip

    为了实现这样的效果,我们需要使用JavaScript或者jQuery等库来监听用户的输入事件,并根据输入的字符数动态更新样式。在这个案例中,可能是通过检测输入框的`value.length`与`maxlength`的比较,当达到或超过`...

    jquery实现输入框字数限制代码

    本篇文章将详细介绍如何使用jQuery实现输入框字数限制,并通过实例代码进行解析。 首先,我们需要理解jQuery的基本用法。jQuery通过选择器选取DOM元素,然后对这些元素执行各种操作。例如,`$("#myInput")`会选择ID...

    一些jQuery粉色风格的常用网页控件实例.rar

    综上所述,这个压缩包提供的实例展示了如何结合jQuery和CSS3来创建一个具有粉色主题的网页界面,其中包含了基本的网页控件和一些实用的前端功能。通过学习和实践这些示例,开发者可以提升自己在网页交互设计和前端...

    HTML5输入框字数限制提示特效.zip

    总的来说,"HTML5输入框字数限制提示特效"是一个结合HTML5、CSS3和JavaScript的实例,展示了如何利用现代Web技术创建具有反馈机制的用户界面。这种技术在网页表单、评论系统、聊天应用等各种需要字符限制的场景中...

    vuejs数据超出单行显示更多,点击展开剩余数据实例

    文章通过具体的代码示例,详细阐述了实现这一需求的整个过程,包括如何使用Vue的指令和方法来控制DOM元素的显示与隐藏。 知识点可以从以下几个方面进行详细说明: 1. Vue.js基础概念: - Vue.js是一个用于构建...

    js 文字超出长度用省略号代替,鼠标悬停并以悬浮框显示实例

    在本文中,我们将探讨如何使用JavaScript和CSS技术实现当网页中的文本内容超出设定的长度时,自动用省略号(...)来代替超出部分,并且当用户将鼠标悬停在该文本上时,显示完整的文本信息。这通常是在网页设计中用来...

    2021-2022计算机二级等级考试试题及答案No.16300.docx

    16. **E-R图**:E-R图(实体-关系图)用于描述数据库的实体、属性和关系,联系可以包含属性,并且实体间的关系可以是1:1、1:N、M:N。 17. **栈的特性**:栈遵循后进先出(LIFO)原则,所以元素出栈顺序是EDCBA54321...

    毕业论文-源代码- JSP新闻管理系统(SQLServer数据库、使用说明书)论文字数:27974字.zip

    10. **版本控制**:开发过程中,源码可能使用Git等版本控制系统进行管理,便于团队协作和代码版本回溯。 总的来说,《JSP新闻管理系统》是一个综合运用了多种技术的Web应用实例,它展示了如何通过JSP、SQLServer...

    KindEditor手册

    - **自定义DOM类库**:内置强大的DOM操作类库,可以实现对DOM元素的精确控制。 - **可扩展性强**:基于插件化设计,所有的功能都以插件的形式存在,可以根据实际需求选择性加载。 - **易于定制样式**:通过简单的CSS...

    react-reactmarker高亮显示关键字并为您的文字添加颜色

    3. **创建实例**:在你的组件中,创建一个ReactMarker实例,传入要显示的文本和关键字数组。例如: ``` 这是你要显示的文本" keywords={['关键字1', '关键字2']} /&gt; ``` 4. **自定义样式**:如果你需要定制高亮...

Global site tag (gtag.js) - Google Analytics