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 接口,使用锁的目的就是管理对共享资源的并发访问,保证数 ...
随机推荐
- Windows学习总结（1）——win10系统最新快捷键汇总
Win10新增功能快捷键大全: 贴靠窗口:Win + 左/右 > Win + 上/下 > 窗口可以变为 1/4 大小放置在屏幕 4 个角落. 切换窗口:Alt + Tab(不是新的,但任 ...
- 解决xorm逆向mssql报datetime2不兼容的异常错误
xorm作为golang开发者的一大利器,深受大家的喜爱,可是最近在逆向mssql的时候,报了这么一个错误: 最后找了半天发现xorm没有预置DateTime2类型,经过几番折腾,在xorm源码的en ...
- HDU 1166 敌兵布阵 Segment Tree题解
本题是最主要的分段树操作了.或者一般叫线段树,只是好像和线段没什么关系,仅仅是分段了. 不使用lazy标志,更新仅仅是更新单点. 假设不使用分段树,那么更新时间效率仅仅须要O(1),使用分段树更新效率 ...
- 关于XAMPP安装后APACH无法启动的问题
Xampp的获得和安装都十分简单,你仅仅要到下面网址: http://www.apachefriends.org/zh_cn/xampp.html 下载xampp就可以.我安装的是windows版本号 ...
- 用VXE保护Linux系统安全
本文被转载在:http://www.linuxso.com/a/linuxxitongguanli/161.html 650) this.width=650;" onclick=&quo ...
- 20.SpringBoot 之 读取环境变量和绑定属性对象
转自:https://blog.csdn.net/catoop/article/details/50548009
- vue实现多语言国际化(vue-i18n)，结合element ui、vue-router、echarts以及joint等。
老板说我们的项目要和国际接轨,于是乎,加上了多语言(vue-i18n).项目用到的UI框架是element ui ,后续echarts.joint等全都得加上多语言. 一.言归正传,i18n在vue项 ...
- python3中让程序暂停运行的语句
https://blog.csdn.net/zmz971751504/article/details/78288988
- 使用Docker来运行WebApp
原文:使用Docker来运行WebApp (作者:陈玓玏) 1.加载镜像到容器并运行webapp脚本 先进入管理员模式: su root 然后使用已有的webapp镜像来练习在docker上运行web ...
- SoapUI、Jmeter、Postman三种接口测试工具的比较分析——灰蓝
前段时间忙于接口测试,也看了几款接口测试工具,简单从几个角度做了个比较,拿出来与诸位分享一下吧.各位如果要转载,请一定注明来源,最好在评论中告知博主一声,感谢.本报告从多个方面对接口测试的三款常用工具 ...