css3-11 如何让html中的不规则单词折行
css3-11 如何让html中的不规则单词折行
一、总结
一句话总结:用word-wrap属性:word-wrap:break-word;
1、word-break和word-wrap的区别?
推荐word-wrap,
word-break:所有单词只要范围不够一律折行
word-wrap:不规则单词折行,规则单词不折行
不好记得话看各自的属性值就知道了
15 /*word-break:break-all;*/
16 word-wrap:break-word;
2、word-break和word-wrap的属性值分别是什么?
break-all 和 break-word 其实属性值和功能是一一对应的
15 /*word-break:break-all;*/
16 word-wrap:break-word;
二、如何让html中的不规则单词折行
1、相关知识
word-wrap:break-word;
2、代码
word-wrap单词折行
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>index</title>
<style>
*{
font-family: 微软雅黑;
} div{
width:500px;
height:300px;
background: #ccc;
/*word-break:break-all;*/
word-wrap:break-word;
}
</style>
</head>
<body>
<div>
<p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
<p>linux is very much!linux is very much!linux is very much!linux is very much!linux is very much!linux is very much!linux is very much!linux is very much!linux is very much!linux is very much!linux is very much!linux is very much!linux is very much!</p>
<p>linux is very much!</p>
<p>linux is very much!</p>
<p>linux is very much!</p>
</div>
</body>
</html>
css3-11 如何让html中的不规则单词折行的更多相关文章
- span 右浮动折行 解决ie6/7中span右浮动折行问题
A floated box is shifted to the left or right until its outer edge touches the containing block edge ...
- span 右浮动折行 解决ie6/7中span右浮动折行问题
RM8005: IE6 IE7 IE8(Q) 中行内元素后相邻的浮动元素在某些情况下会折行放置在之前行内元素所在行框的底部 标准参考 W3C CSS 2.1 规范文档里对于浮动元素与非浮动行内元素相邻 ...
- ie6/7/8中span右浮动折行问题的解决方案
浮动标准: W3C CSS 2.1 规范文档里对于浮动元素与非浮动行内元素相邻时的情况有如下解释.以下是关键段落: A floated box is shifted to the left or ri ...
- 借助CAD在Altium Designer中定义不规则PCB外形
借助绘图软件CAD在Altium Designer中定义不规则PCB外形. 工具/原料 CAD2007 Altium Designer2015 方法/步骤 借助CAD绘制的不规则外形,保存成DXF格式 ...
- 《python解释器源码剖析》第11章--python虚拟机中的控制流
11.0 序 在上一章中,我们剖析了python虚拟机中的一般表达式的实现.在剖析一遍表达式是我们的流程都是从上往下顺序执行的,在执行的过程中没有任何变化.但是显然这是不够的,因为怎么能没有流程控制呢 ...
- 第11.20节 Python 中正则表达式的扩展功能:后视断言、后视取反
一. 引言 在<第11.19节 Python 中正则表达式的扩展功能:前视断言和前视取反>中老猿介绍了前视断言和前视取反,与二者对应的还有后视断言和后视取反. 二. (?<=-)后视 ...
- SQL-61 对于employees表中,给出奇数行的first_name
题目描述 对于employees表中,给出奇数行的first_nameCREATE TABLE `employees` (`emp_no` int(11) NOT NULL,`birth_date` ...
- 使用strtok_s函数从一个字符串中分离出单词
下面的代码从含有多个结束符的字符串中分离出单词来,需要对strtok_s有清楚的认识.这段代码是我在写一个处理文件中单词个数时用来分离读取到的字符串中的单词时写的,亲测可用~ 1 2 3 4 5 6 ...
- 三分钟入门 InnoDB 存储引擎中的表锁和行锁
各位对 "锁" 这个概念应该都不是很陌生吧,Java 语言中就提供了两种锁:内置的 synchronized 锁和 Lock 接口,使用锁的目的就是管理对共享资源的并发访问,保证数 ...
随机推荐
- windows10系统window键失灵,没有反应
今天键盘的的Window键(win键)按了没反应,某度一圈全是它的垃圾营销号文章,没卵用..最后在微软官方社区支持找到解决方案.也建议大家遇到系统问题到微软社区去寻求帮助,毕竟人家是专业. 解决办法 ...
- 阅读笔记—EL表达式
表达式语言(EL) 表达式语言是一种在JSP页面中使用的数据访问语言,通过它可以很方便地在JSP页面中访问应用程序数据. 使用EL访问数据 表达式语言的使用形式: ${exp ...
- 阅读笔记—MVC
MVC设计模式 Model 1 体系结构 在Model 1 体系结构中,每一个请求的目标都是JSP页面.JSP页面负责完成请求所需要的而所有任务,其中包括验证客户.使用JavaBeans访问数据库及管 ...
- FZU 1608 Huge Mission
Huge Mission Time Limit: 1000ms Memory Limit: 32768KB This problem will be judged on FZU. Original I ...
- 图片工具GraphicsMagick的安装配置与基本使用
本文使用GraphicsMagick的版本为1.3.18 (Released March 9, 2013). 1.简介 GraphicsMagick是一个短小精悍的的图片处理工具和库集合.对于Java ...
- LeetCode 06 ZigZag Conversion
https://leetcode.com/problems/zigzag-conversion/ 水题纯考细心 题目:依照Z字形来把一个字符串写成矩阵,然后逐行输出矩阵. O(n)能够处理掉 记i为行 ...
- 基本3D变换之World Transform, View Transform and Projection Transform
作者:i_dovelemon 来源:CSDN 日期:2014 / 9 / 28 主题:World Transform, View Transform , Projection Transform 引言 ...
- notification-应用实例
这几天接触到了notification,现在就把它的常用方法总结下. 直接看如下代码就行了 ComponentName componetName = new ComponentName("c ...
- [NOI.AC#31]MST 计数类DP
链接 注意到 \(n\) 只有40,爆搜一下发现40的整数拆分(相当于把 \(n\) 分成几个联通块)很少 因此可以枚举联通块状态来转移,这个状态直接用vector存起来,再用map映射,反正40也不 ...
- Linux下SPI读写外部寄存器的操作
SPI写寄存器操作: staticvoid mcp251x_write_reg(struct spi_device *spi, uint8_t reg, uint8_t val) { stru ...