文本省略号

1.文本省略号

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<script src="http://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
    $(function () {
        function sucstr(name,num,a){
            var clientw = $(document.body).width();
            var pur_span_text = $(name).text();
            if(clientw<375){
                pur_span_text = pur_span_text.substr(0,num)+‘...‘;
            }
            else if(clientw>=375&&clientw<=410){
                num=num+a;
                pur_span_text = pur_span_text.substr(0,num)+‘...‘;
            }
            else if(clientw>=410&&clientw<=500){
                num=num+a+a;
                pur_span_text = pur_span_text.substr(0,num)+‘...‘;
            }
            else{
            }
            $(name).text(pur_span_text);
        }

        sucstr(‘.weui_media_title‘,12,3);

    });
</script>
<div class="weui_media_title">

    123232142412
</div>
</body>
</html>

2.文本居中

3.禁用UC浏览器左右滑动切换页面

//禁用uc浏览器左右滑动切换页面问题
(function(){
var control = navigator.control || {};
if(control.gesture){
control.gesture(false);
}
})();

时间: 2025-01-02 22:45:35

文本省略号的相关文章

单行文本省略号和多行文本省略号

单行文本省略号的设置必须满足,以下四个条件: 1.固定的宽度:width:value; 2.强制在一行显示:white-sapce:nowrap; 3.溢出部分隐藏不可见:overflow:hidden; 4.显示省略号:text-overflow:ellipisis; 多行文本省略号: 1.display:-webkit-box; 2.-webkit-box-orient:vertical; 3.-webkit-line-clamp:3; 4.overflow:hidden; 原文地址:htt

css文本截字,超出文本省略号显示

一.单行文本截字 p { text-overflow: ellipsis;/*显示省略号代替裁剪的文本*/ white-space: nowrap;/*空白处理方式 不换行*/ overflow: hidden;/*溢出隐藏*/ } 效果: 二.多行文本截字 p{ display:-webkit-box;/*设置盒子为弹性盒容器*/ -webkit-box-orient:vertical;/*设置盒子内部排列方式为垂直排列*/ -webkit-line-clamp:2;/*显示两行*/ text

css文本省略号

这里记录下如何用CSS实现单行.多行文本溢出容器的时候用省略号代替溢出部分. 单行文本溢出容器时显示省略号的CSS实现方法 /* 规定当内容溢出元素框(容器)时隐藏 */ overflow: hidden; /* 规定当文本溢出包含元素(容器)出现省略号 */ text-overflow: ellipsis; /* 规定段落中的文本不进行换行 */ white-space: nowrap; 要注意的是,因为是要在文本溢出容器时候显示省略号,因此容器是需要有固定的宽度的. 示例:我是想要省略号的文

css实现文本超出部分省略号显示

一般超出文本显示分为两种:单行超出文本和多行超出文本省略号显示,实现方式使用纯css实现: 1 div { // 单行 2 white-space: nowrap; 3 overflow: hidden; 4 text-overflow: ellipsis; 5 } 1 div { // 多行 2 overflow: hidden; 3 text-overflow: ellipsis; 4 display: -webkit-box; // 注意不是flex 5 -webkit-line-clam

文本设置+元素类型

一.文本 1.文本溢出 overflow:文本溢出设置: overflow:scroll /auto /hidden/inherit:             超出时,滚动查看(未超出时也会有滚动机制)/超出时,滚动查看(未超出时不会有滚动机制)/ 超出隐藏 /继承父级的overflow设置 2.文本空白 white-space:normal; 默认值 white-space:pre;空白会被浏览器保留,保留原有格式,不会被迫换行 white-space:pre-wrap;保留所有格式,会被迫换

H5第一周

<!DOCTYPE html><!--   ↑ 声明文档类型为HTML5文件.       文档声明,在HTML文档必不可少,且必须放在文档第一行.--> <head>    <!--{meta标签}    1.charset属性:单独使用.设置文档字符集编码格式.          >>>写法:<meta charset="UTF-8">       >>>常见的中文编码格式:    GB-23

HTML5周记(一)

各位开发者朋友和技术大神大家好!博主刚开始学习html5 ,自本周开始会每周更新技术博客,与大家分享每周所学.鉴于博主水品有限,如发现有问题的地方欢迎大家指正,有更好的意见和建议可在评论下方发表,我会第一时间回复.好了,话不多说,下面开始我的分享! 第一章 HTML的初识 一.HTML的基本结构 <!DOCTYPE html><!--声明文档类型为HTML文件. 文档声明.注意:文档声明在HTML文档中必不可少!且必须放在文档第一行.--><html> <head

CSS的学习使用

<head> <meta charset="UTF-8"> <title>CSS常用选择器</title> <!--HTML注释--> <style type="text/css"> /*CSS语法必须写在<style>标签中*/ /*CSS注释*/ [锁定] /*命名:body中table后+id="table" 如<table id="tabl

2017.3.12 H5学习的第一周

本周我开始了H5的学习,在这一周里我们从html的基本标签开始一直讲到了才算css的用法,接下来我将记录下来本周我学到的H5的内容. 首先是声明文档,声明文档类型是HTML5文件,它在HTML文档必不可少且必须放在文档第一行. 写法:<!DOCTYPE html>. 接着我们学习了html的基本结构: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title&