如何使用css控制文章标题字数？

最佳答案

控制文章标题字数，不是动态网页的专利，如果静态页面使用CSS样式，也可以实现相同的效果！

看这个例子，你们可以复制到记事本保存为HTML文件看效果！

<html>

<title>css控制字数</title>

<head>

<style type="text/css">

.dd

{

border: solid 1px gray;

width:180px;

overflow: hidden;

text-overflow: ellipsis;

white-space: nowrap;

course:hand;

}

</style>

</head>

<body>

<span class="dd">

信心网使用CSS控制文章标题字数信心网使用CSS控制文章标题字数信心网使用CSS控制文章标题字数

</span>

<br>

<div class="dd">

信心网使用CSS控制文章标题字数信心网使用CSS控制文章标题字数信心网使用CSS控制文章标题字数

</div>

</body>

</html>

看到效果后，您应该相信这不是虚言了吧，o(∩_∩)o...！

其中white-space 属性设置如何处理元素内的空白。

这个属性声明建立布局过程中如何处理元素中的空白符。值 pre-wrap 和 pre-line 是 CSS 2.1 中新增

的。

继承性：Yes
JavaScript 语法
CSS 属性也可通过一段 JavaScript 被动态地改变。

脚本语法：
object.style.whiteSpace="nowrap"在我们的 HTML DOM 教程中，您可以找到更多有关 whiteSpace 属性

的细节。

p

{

white-space: normal

}

可能的值
值 描述
normal 默认。空白会被浏览器忽略。
pre 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
nowrap 文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。

名称：text-overflow
分类：IE专有样式
简述：设置是否使用省略号标示文本溢出
概述：text-overflow是设置是否使用省略号标示文本溢出的样式(Style)。
text-overflow详细说明语法：

text-overflow : clip | ellipsis

取值：

clip :　 默认值。不显示省略标记(...)，而是简单的裁切
ellipsis :　 当对象内文本溢出时显示省略标记(...)

overflow 属性设置当元素的内容溢出其区域时发生的事情。

继承性：No

说明
这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，用户代理都会提供一种滚动机制。因此，有可能即使元素

框中可以放下所有内容也会出现滚动条。
JavaScript 语法
CSS 属性也可通过一段 JavaScript 被动态地改变。

脚本语法：
object.style.overflow="hidden"在我们的 HTML DOM 教程中，您可以找到更多有关 overflow 属性 的细节。

在我们的 HTML DOM 教程中，您也可以找到完整的 Style 对象参考手册。
例子
p
{
overflow: scroll
}
可能的值
值 描述
visible 默认。内容不会被修剪，会呈现在元素之外。
hidden 内容会被修剪，但是浏览器不会显示供查看内容的滚动条。
scroll 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
auto 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。

jquery方法

$(".table-title").each(function(){

 var maxwidth=20;

 if($(this).text().length>maxwidth){

  $(this).text($(this).text().substring(0,maxwidth));

  $(this).html($(this).html()+"…");

 }

});

　　

如何使用css和jquery控制文章标题字数？的更多相关文章

  1. 织梦arclist文章标题字数太短

    解决dedecms UTF-8首页文章标题显示字数太短的办法原因分析:因为UTF-8编码1个中文汉字占用的是3个字节,GBK占用的是2个字节,所以,原先$titlelen = AttDef($titl ...

  2. 修改DEDECMS文章标题长度,解决DEDECMS文章标题显示不全

    dedecms系统使用过程中,常遇到输入的标题原本输入的字数跟保存成功后的数字长度不一样,这个是因为 织梦dedecms系统默认的文章标题字数限制是60,也就是只能输入30个汉字,超过的会自动截断删除 ...

  3. DEDECMS文章标题显示不全的原因以及解决方法

    首先这里说一下编码问题:UTF-8与GBK(通常为GB2312). GBK是在国家标准GB2312基础上扩容后兼容GB2312的标准(好像还不是国家标准):GBK编码专门用来解决中文编码的,是双字节的 ...

  4. css,js,jquery的载入方式和属性控制

    本文章主要总结了css,js,jQuery在编写程序时的载入方式,与属性控制方式html和css共同组成了一个最基础的网页,js为标签样式提供动态效果 一,css的载入方式与属性控制 1.1,css引 ...

  5. jquery控制css的display(控制元素的显示与隐藏)

    使用jquery控制div的显示与隐藏: $("#div的id").show()表示display:block, $("#div的id").hide()表示di ...

  6. jquery控制css的display属性(显示与隐藏)

    jquery控制div的显示与隐藏,很方便的. 例如: $("#id").show()表示display:block, $("#id").hide()表示dis ...

  7. 转载一篇比较详细的讲解html,css的一篇文章，很长

      转载自这里,转载请注明出处. DIV+CSS系统学习笔记回顾   第一部分 HTML 第一章 职业规划和前景 职业方向规划定位: web前端开发工程师 web网站架构师 自己创业 转岗管理或其他 ...

  8. 如何修改DEDECMS文章标题长度

    方法一:      首先你要进入dedecms后台,系统——系统基本参数——其他选项——文档标题最大长度——在这修改为200或更大(其实200应该是足够了). 方法二:      进入phpmyadm ...

  9. Dede文章标题长度修改

    方法一.首先你要进入dedecms后台,系统——系统基本参数——其他选项——文档标题最大长度——在这修改为200或更大(其实200应该是足够了). 方法二.进入phpmyadmin,点击dede_ar ...

随机推荐

  1. Mybatis SQL语句查询

    MyBatis中使用in查询时的注意事项 foreach的主要用在构建in条件中,它可以在SQL语句中进行迭代一个集合. foreach一共有三种类型,分别为List,[](array),Map三种. ...

  2. 样式重置 取消input默认样式

    body, h1, h2, h3, h4, h5, h6, hr, p,blockquote, dl, dt, dd, ul, ol, li,pre, form, fieldset, legend, ...

  3. SSDT Hook

    一.效果图 二.分析 这里对NtCreateProcessEx做拦截,用WinDbg来定位该函数在SSDT中的记录地址: : kd> dd KeServiceDescriptorTable 80 ...

  4. iOS 获取当前城市

    1.倒入头文件 #import <CoreLocation/CoreLocation.h> 2.实现定位协议CLLocationManagerDelegate 3.定义定位属性  @pro ...

  5. 05-Tom猫（UIImageView的简单运用）

    ViewController.h文件中: @interface ViewController : UIViewController @property (weak, nonatomic) IBOutl ...

  6. partial class 说明

    C# 2.0 可以将类.结构或接口的定义拆分到两个或多个源文件中,在类声明前添加partial关键字即可. 例如:下面的PartialTest类 class PartialTest { string ...

  7. Html5元素及基本语法

    HTML标签开始标签(opening tag):开放标签结束标签(closing tag):闭合标签 元素定义:HTML元素指的是从开始标签到结束标签的代码(元素以开始标签为起始以借宿标签终止)元素的 ...

  8. Zookeeper 脑裂

    转自 http://blog.csdn.net/u010185262/article/details/49910301 Zookeeper zookeeper是一个分布式应用程序的协调服务.它是一个为 ...

  9. Sublime Text2 注册码 汉化 配置lua开发环境

    1.注册  help --> Enter License ----- BEGIN LICENSE ----- Andrew Weber Single User License EA7E-8556 ...

  10. delphi中表示跳出的有break，continue, exit，abort, halt, runerror

      1.break 强制退出循环(只能放在循环中),用于从For语句,while语句或repeat语句中强制退出. 2.continue 用于从For语句,while语句或repeat语句强行结束本次 ...