css 3 常用文本属性

最新推荐文章于 2020-10-08 17:36:38 发布

szymark

最新推荐文章于 2020-10-08 17:36:38 发布

阅读量567

点赞数

分类专栏： web 前端文章标签： CSS3 文本属性

本文链接：https://blog.csdn.net/szy494620829/article/details/9051497

版权

web 前端专栏收录该内容

34 篇文章 0 订阅

订阅专栏

一 text-overflow (规定当文本溢出包含元素时发生的事情)

浏览器支持：所有主流浏览器

值：clip (修剪文本)

ellipsis (显示省略符号来代表被修剪的文本)

string (使用给定的字符串来代表被修剪的文本)

二 word-break (规定自动换行的处理方法)

浏览器支持：除opera以外的所有主流浏览器

值：normal (浏览器默认换行规则)

break-all (允许在单词内换行)

keep-all (只能在半角空格或连字符处换行)

三 word-wrap(允许对长的不可分割的单词进行分割并换行到下一行)

浏览器支持：所有主流浏览器

值：normal (浏览器默认规则)

break-word (在长单词或 URL 地址内部进行换行)

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

szymark

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

html5+css3实现字体飘落

11-15

采用html5+ccs3实现飘落的雪花,飘落的字体,字体固定落子版本,字体纷飞落子版本等...此压缩包包含多个demo,代码简单通俗易懂,适合于新手学习与开发。

前端提高篇（三十七）CSS进阶5：CSS3常用属性（三）文字属性（换行，溢出，字体）

安之ccy的博客

03-09

402

换行与溢出背景：当box里是英文字符串，并设置了比这个字符串长度要短的宽度，系统会默认以半角空格或连接符换行，如果没有空格和连接符，就不会换行，直接冲出box；当box里是中文字符，box宽度依然比较小，当文字的长度到达box宽度了，系统也会换行 <a href="https://www.baidu.com">百度一下你就知道</a> <a href="https://www.baidu.com">welcome to my kidom</a> <a

参与评论您还未登录，请先登录后发表或查看评论

使用css方法，实现文字字符串截断处理

十年树木的博客

01-21

2966

其实这个也是借鉴别人的，好东西需要拿出来和大家 <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd“> css文字截断____dowhatyouwant body{ background-color:#f4f4f4; font-size:1

文本字数过多时，以省略号显示

weixin_34367257的博客

10-14

172

# 文本字数过多时，以省略号显示 1、对于table中单元格中的字符数超过限定的宽度时，以省略号显示，但是当鼠标悬浮在上面时，能够完整地显示出单元格的内容。设置表格的标头中字符数限制（让标头单元格宽度固定）```style#dataTab{table-layout: fixed}#dataTab th{width:80px;white-space: nowrap; //设置如何处理元素内的空白w...

text-overflow的用法

留白空间

12-27

5849

text-overflow 规定当文本溢出包含元素时的显示，有两个固定值，分别是clip和ellipsis，也可直接传字符串string： clip ：默认值。不显示省略标记(…)，而是简单的裁切； ellipsis：当对象内文本溢出时显示省略标记(…)； string：使用给定的字符串来代表被修剪的文本。使用text-overflow:ellipsis时要注意一下两点： 1.overf

CSS中一些常用的文本属性整理

09-25

接下来将详细介绍CSS中一些常用的文本属性。 text-overflow属性用于处理文本溢出容器边缘时的显示情况。它有两个值：clip和ellipsis。clip属性表示溢出的内容会被直接裁减掉，而ellipsis则在内容溢出时显示省略标记...

css常用属性

11-19

### CSS常用属性详解 #### 一、CSS文字属性 CSS中的文字属性可以帮助我们调整文本的显示方式，使得页面上的文字更加美观和易于阅读。 - **color:** 用于设置文本的颜色。例如：`color:#999999;` 将文本颜色设置为...

CSS常用文本样式总结

09-27

通过上述常用文本样式属性的介绍，可以看出CSS为文本处理提供了强大而灵活的工具。使用这些属性可以满足各种文本排版需求，从而在网页设计中创造出既美观又实用的文本效果。无论是在创建专业的文档还是为网页内容...

CSS的部分常用属性整理

09-22

接着是CSS文本属性。`text-indent`用于控制文本首行缩进，`text-transform`用于转换文本大小写，`text-decoration`用于添加或删除文本装饰，`white-space`管理空白字符的处理，`color`设置文本颜色，`line-height`...

搜集整理的前端面试题1

遇见更好的自己

10-26

2621

1. Doctype作用？标准模式与兼容模式各有什么区别? （1）、声明位于位于HTML文档中的第一行，处于标签之前。告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。（2）、标准模式的排版和JS运作模式都是以该浏览器支持的最高标准运行。在兼容模式中，页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。 2

CSS3中text-overflow的使用

aspire_cj的博客

07-31

1857

一、text-overflow使用情况：指定当文本溢出包含它的元素。 text-overflow的三个有效属性：属性值使用效果 clip 修剪文本，超出部分截断 ellipsis 显示省略符号(…)来代表被修剪的文本 string 使用给定的字符串来代表被修剪的文本二、单行文本溢满：当目标文本超过预期定义的长度时，超出的内容可以通过text-overflow来进行直接修剪、使用…代替、使用自定义字符来显示。示例： .nameOverflow { ove

text-overflow:ellipsis显示省略符号来代表被修剪的文本

iteye_4180的博客

05-06

341

text-overflow:ellipsis 显示省略符号来代表被修剪的文本浏览器支持性：所有主流浏览器都支持（chrome、ie、firefox、safari、opera）注意：下面这些css属性要一起使用（text-overflow适用块级元素） overflow: hidden; text-overflow:ellipsis; white-space:...

我的前端学习笔记 css3,text-overflow

树海的专栏

03-27

908

今天笔试的时候遇到一个问题，html如何在对象区域文字溢出时候用(...)来代替溢出文字，由于对css3属性还不怎么属性我并想起来解决方法。回去查了下发现需要text-overflow属性可以解决这个问题。首先让我们看下w3school上面的语法： text-overflow: clip|ellipsis|string; clip:修剪文本，不会显示... ellipsis:显示省略符号

html的text里文字过长裁剪显示

j20lin的博客

03-27

1899

实例使用 text-overflow 属性： div.test { white-space:nowrap; width:12em; overflow:hidden; border:1px solid #000000; } 下面两个 div 包含无法在框中容纳的长文本。正如您所见，文本被修剪了。这个 div 使用 "text-overflow:ellipsi

用省略符号来代表被修剪的文本，表格中文字太多，只显示部分实现

ahzxj2012的专栏

10-10

1363

My JSP 'view.jsp' starting page 户名内容时间时间 admin 123 2012 20124 admin 233ssssssssssssssssssssssssss33f

小样式记录-显示省略符号来代表被修剪的文本。

界之边缘的轮回

03-30

530

不换行自动省略文字，以"…"代替。 overflow: hidden; （溢出剪切） text-overflow: ellipsis;（显示省略符号来代表被修剪的文本。） white-space: nowrap;(不换行)

css 文本溢出 0302

pyhui的技术博客

03-02

210

overflow white-space text-overflow

CSS复习总结

qq_44786519的博客

10-08

216

CSS盒模型就是用来装页面上的元素的矩形区域。CSS中的盒子模型包括IE盒子模型和标准的W3C盒子模型。 box-sizing（有3个值）：border-box，padding-box，content-box。从图中我们可以看出，这两种盒子模型最主要的区别就是width的包含范围，在标准的盒子模型中，width指content部分的宽度，在IE盒子模型，width表示content+padding+border这三个部分的宽度，故这使得在计算整个盒子的宽度时存在着差异：标准盒子模型的盒子宽度：bor

CSS中span内容超出部分以...显示