CSS文本属性 文本阴影text-shadow 换行 text-overflow


div{
font-size: 20px;
text-shadow: 5px 5px 5px #333;
text-shadow: 10px 10px 4px rgba(255, 0, 0, .5); /*可以使用rgba设置透明效果*/
}
h-shadow:第一个属性值,表示水平阴影的位置,可以是负值
v-shadow:第二个属性值,表示垂直阴影的位置,可以是负值
blur:第三个属性值,表示模糊的距离,设置为负值时,没有模糊的效果
color:第四个属性值,表示阴影的颜色,也可以用rgba设置为透明颜色
===============================================================
该属性暂不支持,任何浏览器。

---------------------

word-break 有三个属性,针对整段文字而言:
normal 和 keep-all 效果差不多(换行的规则是有空格,且一行末尾放不下,换行):
1,顶格,最后一个单词(包括连字符)放不下就换行。
2,最后一个单词加一个标点符号,放不下也换行。
3,值为:keep-all,如果内容是中文,中文之间没空格,一句看成一个单词。行末放不下一整句才换行。
break-all:
1,顶格,最后一个单词放不下就拆开单词换行,不利阅读。

换行规则:只有空格才换行。中文之间是没空格的,所以把一句看成一个单词,如果值是keep-all,那么最后放不下一整句才换行。
在中文中 normal 和 break-all效果差不多,

======================================

word-wrap 只针对很长的拉丁文。对于方块文字无效,如:中文,日文,韩文等等。值:
1,normal 不换行,长单词容易溢出父元素。
2,break-word 长单词到一行结尾会自动换行。

--------------------------------------------------------

在IE和火狐浏览器中 一定要加上:text-align:justify。然后再设置text-algin-last。
text-align-last 对文本最后一行进行设置:
auto/initial: 默认左对齐
left: 强制左对齐
right: 强制右对齐
center: 居中对齐
start: 前面文本左对齐,最后一行也左对齐
end: 前面文本左对齐,最后一行就右对齐,反之左对齐。
inherit: 继承父元素的对齐方式
=================================

使用text-overflow属性前,必须先设定overflow:hidden; 溢出部分隐藏,否则text-overflow属性值无效。
clip 切掉
ellipsis 溢出部分使用三个点的省略号。
string 自定义符号,如:“>>” 该值只有火狐浏览器支持。
.one{overflow: hidden; text-overflow: clip;}
.two{overflow: hidden; text-overflow: ellipsis;}
.three{overflow: hidden; text-overflow: ">>"}
===============
CSS文本属性 文本阴影text-shadow 换行 text-overflow的更多相关文章
- CSS 常用属性之 阴影
text-shadow 是一个给文字添加阴影的属性 text-shadow: X偏移量,Y偏移量,模糊值,颜色 可以同时设置多个文本阴影,需要用逗号隔开 如果是需要兼容低版本的浏览器 -webkit ...
- CSS(二)属性--文本设置
HTML代码一 <body> <div>这是一个很黑很黑的夜晚,黑云密布,没有任何光亮透过.卖火柴的小姑娘.......</div> </body> C ...
- Web前端新人笔记之文本属性
前一段时间因工作时间减缓了更新笔记的时间.我也不知道有没有会观看并且能不能帮到一些初学者,这只是我的一些小随笔而已.当然我也希望的的每一篇随笔都可以帮到更多的想要学习前端开发的初学者们,更希望你们也可 ...
- web前端学习笔记:文本属性
今天的web前端笔记主要讲述文本属性,希望能帮助到正在学习web前端开发的初学者们,废话不多说了,一起来看看文本属性的相关内容吧. 文本属性 文本缩进 将Web页面上的一个段落第一行缩进,这是一种最常 ...
- CSS边框属性
边框 圆角 border-radius border-top-left-radius border-top-right-radius border-bottom-left-radlius border ...
- CSS常用属性-xy
一.文本Text CSS text-align 属性 文本对齐方式 CSS text-decoration 属性 text-decoration 属性规定添加到文本的修饰 CSS line-heigh ...
- CSS字体属性大全
文章转自:http://www.10wy.net/Article/CSS/CSS_list_8.html查看更多更专业性的文章请到:网页设计网 CSS字体属性 字体名称属性(font-family) ...
- 1+x证书学习日志——css常用属性
## css常用属性: 1:文本属性: 文本大小: font-size:18px; 文本颜色 colo ...
- [CSS]文本属性(Text)
CSS 文本属性(Text) 属性 描述 CSS color 设置文本的颜色. 1 direction 规定文本的方向 / 书写方向. 2 letter-spacing 设置字符间距. 1 lin ...
随机推荐
- 在ASP.NET Core中使用EPPlus导入出Excel文件
这篇文章说明了如何使用EPPlus在ASP.NET Core中导入和导出.xls/.xlsx文件(Excel).在考虑使用.NET处理excel时,我们总是寻找第三方库或组件.使用Open Offic ...
- 分布式日志框架Exceptionless之生产环境部署步骤
Exceptionless 是一个开源的实时的日志收集框架,它将日志收集变得简单易用并且不需要了解太多的相关技术细节及配置.本篇基于我的上一篇<基于Exceptionless实现分布式日志> ...
- Java进阶篇设计模式之九----- 解释器模式和迭代器模式
前言 在上一篇中我们学习了行为型模式的责任链模式(Chain of Responsibility Pattern)和命令模式(Command Pattern).本篇则来学习下行为型模式的两个模式, 解 ...
- FreeSql.DbContext 第二个版本介绍
FreeSql.DbContext 实现类似 EFCore 使用方法,跟踪对象状态,最终通过 SaveChanges 方法提交事务. 目前是第二个初版,已实现状态跟踪保存(导航属性的跟踪暂时不支持). ...
- 文本输入框input text输入字母自动转大写
现在需要把一个input输入框内的字母自动转变为大写. 查了下资料,目前收集到的方法有两种: 使用JavaScript,在input标签添加onkeyup方法,将字符转为大写. <input n ...
- 3星|路江涌《共演战略画布》:PPT技巧级别的创新,缺实际分析案例
作者用自己的思路综合现有各种战略思想,给出企业各阶段各要素的战略分析工具.主要是2*2矩阵和双S曲线两种工具. 从书中的插图来看,这些工具在PPT演示中效果应该会不错. 作者在书中用这些工具做的分析不 ...
- missing requires of libmysqlclient.so.18()(64bit)
错误提示安装依赖的库文件没有找到: libmysqlclient.so.18()(64bit) 解决方法是这样的: 安装mysql-community-libs-compat-5.7.18-1 ...
- centos下python3.6安装uwsgi失败。
报错信息(省略大部分): plugins/python/uwsgi_python.h::: fatal error: Python.h: No such file or directory #incl ...
- 【js】项目中有关时间的问题
一.时间戳 简单讲,unix时间戳就是从1970-01-01开始所经过的秒数,什么时候获取时间戳,就是到那个时间点所经历的秒数. 二.JavaScript获取时间戳 根据时间戳的定义,可以使用java ...
- 深入理解 call,apply 和 bind
在JavaScript 中,call.apply 和 bind 是 Function 对象自带的三个方法,这三个方法的主要作用是改变函数中的 this 指向,从而可以达到`接花移木`的效果.本文将对这 ...