css样式控制 字符个数,多余的字用省略号代替
<div class="show">大家好,我是小菜 前端 ,技术不高,正在努力中充电!希望大家多多指教</div>
.show{
width:50px;
padding:5px;
overflow:hidden; //隐藏
white-space:nowrap; //文本不进行换行
word-break: keep-all; //中英文不断词
word-wrap: normal; //保持默认处理
text-overflow: ellipsis; //显示省略符号来代表被修剪的文本
-o-text-overflow: ellipsis;
}
js:
<td class="fyhoverflow">a15666山西省临汾市侯马市樱花县 </td>
$(document).ready(function() {
//限制字符个数
$(".fyhoverflow").each(function() {
var maxwidth = 10;
if ($(this).text().length > maxwidth) {
$(this).text($(this).text().substring(0, maxwidth));
$(this).html($(this).html() + '...');
}
});
});
css样式控制 字符个数,多余的字用省略号代替的更多相关文章
- css 样式控制文本过长实现省略号
css 样式控制文本过长实现省略号 .topicTitle{ text-overflow: ellipsis; max-width: 75%; overflow: hidden; white-spac ...
- php部分:网页中报表的打印,并用CSS样式控制打印的部分;
网页中报表的打印,是通过调用window对象中的print()方法实现打印功能的: 调用浏览器本身的打印功能实现打印 <a href="#" onclick="wi ...
- css样式、js2种方式 控制字符个数,多余的字用省略号代替
大家好,我是小菜 前端 ,技术不高,正在努力中充电!希望大家多多指教:css <div class="show">大家好,我是小菜 前端 ,技术不高,正在努力中充电!希 ...
- css样式控制元素固定在底部
回复固定在底部:css样式用到了 box-sizing属性 box-sizing:border-box; -moz-box-sizing:border-box; /* Firefox */ -webk ...
- 用div和css样式控制页面布局
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- css样式控制鼠标滑过显示
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- WEB入门三 CSS样式表基础
学习内容 Ø CSS的基本语法 Ø CSS选择器 Ø 常见的CSS样式 Ø 网页中3种使用CSS的方式 能力目标 Ø 理解CSS的 ...
- 百万年薪python之路 -- 前端CSS样式
CSS样式 控制高度和宽度 width宽度 height高度 块级标签能设置高度和宽度,而内联标签不能设置高度和宽度,内联标签的高度宽度由标签内部的内容来决定. 示例: <!DOCTYPE ht ...
- 关于Vue-cli 组件引入CSS样式文件
在 Vue-cli 组件 .vue 文件中引入 css 样式表出错 由于使用Vue-cli后, 引入css 样式表 不需要 多余../../ 之类路径 现在写法也发生了改变 <style ...
随机推荐
- 奥迪--A3
-型号:A3 -价格:18-28W -动力:1.4T/1.8T -变速箱:7挡双离合 -长宽高:4.32,1.79,1.43(Limousine:4.46,1.80,1.42) -油箱:50L -发动 ...
- Android中 Bitmap和Drawable相互转换的方法
1.Drawable->Bitmap Resources res=getResources(); Bitmap bmp=BitmapFactory.decodeResource(res, R.d ...
- CG_INLINE,inline 内联函数
内联函数,即在编译的时候将函数体替换函数调用,从而不需要将parameter,return address进行push/pop stack的操作,从而加速app的运行,然而,会增加二进制文件的大小. ...
- 使用ionic2开发一个登录功能
服务的采用Asp.net API实现,数据库用的sqlite,具体实现请看:源代码 唯一需要说明的是跨域问题: 跨域代码: <system.webServer> <httpProto ...
- iOS 简单滤镜
转自:http://blog.csdn.net/lovechris00/article/details/51496458 1.主要是运用 ImageUtil库,把原图通过矩阵色值设置层不同滤镜效果下的 ...
- IOS手动添加CoreData
手动添加coreData: 1.在target-build phrase-Link binary with libraries里增加CoreData Framework 2.加入数据模型:comman ...
- 如何消除MyEclipse导入jQuery库后出现的错误标记
由于MyEclipse提供比较严谨的js校验功能,因此jQuery等前端框架导入到MyEclipse后均会提示错误,比较难看,如果要将校验去掉可以遵循下面步骤:1.点击菜单“MyEclipse”-&g ...
- 可爱的Python_课后习题_CDay−5 Python 初体验和原始需求
计算今年是否是闰年.判断闰年条件,满足年份模400 为0,或者模4 为0 但模100不为0. def is_learp_year(year): """判断年份是否为润年& ...
- css响应式布局RWD
响应式布局结合了三大理念: 1)用于布局的弹性网络(百分比定义宽度) 2)用于图片和视频的弹性媒体 3)媒体查询 在布局中,需要注意的点有: 1)尽量用min-width/max-width,max- ...
- CDN技术详解
CDN,全称为Content DeliveryNetwork,中文意为"内容分发网络"".通过将网络内容发布到最靠近用户的『边缘节点』,使不同地区的用户在访问相同页面.图 ...