p标签不自动换行原因
前言:发现以前写的就像是笔记,哪像博客啊,这里再次修改。
问题描述: 在固定宽度的p元素里(任何块级元素同理),长单词不自动换行,中文字符会自动换行,效果如:http://codepen.io/aliceluojuan/pen/rrxbpO
产生原因:1.英文会将不包含空格、换行的连续文本认为是一个词,所以在默认情况下不换行;
2.中文的话标点文字都是独立的,所以会自动换行;
解决方案:
在英文字不改变内容的情况下,通过设置p元素的
p{ word-wrap:break-word
/*或者是下面一种方法让单词强制换行*/
/*
word-break: break-all;
*/
}
也可以强制将单词换行,demo;
但是word-wrap和word-break的区别是什么呢?
请看这篇文章咯,讲得很详细http://www.cnblogs.com/2050/archive/2012/08/10/2632256.html;我也验证过哟!
p标签不自动换行原因的更多相关文章
- 使用echart的雷达图的时候,如果文字越界的解决办法记录,标签文字自动换行
使用echart的雷达图的时候,如果文字越界的解决办法记录,标签文字自动换行 前几天项目中有一个图表的是用echart生成的,遇到一个问题,就是在手机端显示的售时候,如果文字太长就会超出div,之前的 ...
- 【HTML】让<pre>标签文本自动换行
利用<pre></pre>这个标签可以将其包起来的文字排版.格式,原封不动的呈现出来. 也就是说你输入的东西被原封不动的输出,包括你输入的空格之类的,不用 和<BR> ...
- 导航栏下a标签失效的原因
前天我一直没找到失效的结果,就在刚才,我用不同的浏览器打开我编写的网页,有一个浏览器的图片循环播放效果错位了,我觉得就是它上边的div把他挤下来了.正如前天网上看到的高手的们的说法.我用firebug ...
- 自定义View(四) ViewGroup 动态添加变长Tag标签 支持自动换行
欲实现如下效果: 思路很简单就2步: 1.测量出ViewGroup的大小 2.找出子View的位置 若要实现动态添加标签view,就要实现ViewGroup的onMeasure().onLayout( ...
- Android 自定义View修炼-Android中常见的热门标签的流式布局的实现
一.概述:在日常的app使用中,我们会在android 的app中看见 热门标签等自动换行的流式布局,今天,我们就来看看如何 自定义一个类似热门标签那样的流式布局吧(源码下载在下面最后给出哈) 类似的 ...
- HTML -- 标签记录(随着学习不断更新)
此篇博文主要记录一些标签的常用属性 Font标签 size:字体大小 color:颜色 face:字体 <!DOCTYPE html> <html> <head> ...
- IOS动态自适应标签实现
先上效果图 设计要求 1.标签的宽度是按内容自适应的 2.一行显示的标签个数是动态的,放得下就放,放不下就换行 3.默认选中第一个 4.至少选中一个标签 实现思路 首先我们从这个效果上来看,这个标签是 ...
- JSTL标签库的基本教程之核心标签库(一)
JSTL介绍 Java Server Pages Standard Tag Libray(JSTL):JSP标准标签库,它封装了JSP应用的通用核心功能.JSTL支持通用的.结构化的任务,比如迭代,条 ...
- HTML的各种基本标签
一 .head中的各种标签 1. <!DOCTYPE html><html>文档类型声明 声明当前文件是一个HTML5文件文档 ...
随机推荐
- 如何解决css-子div设置margin-top后,父div与子div一起下移的bug?
根据规范,一个盒子如果没有上补白(padding-top)和上边框(border-top),那么这个盒子的上边距会和其内部文档流中的第一个子元素的上边距重叠. 这是规范引起的普遍问题. 只要给父盒子设 ...
- String 类型
一.不可变 一个 String 类型的值是不可以改变的,比如,String china = "中国",“中国”这个字符串从它创建开始直到销毁都是不可改变的. 二.字符串常量池 字面 ...
- python读取shp
sf = shapefile.Reader("res2_4m.shp") records = sf.records() print sf.fields for record in ...
- Ssh 证书验证 续篇
今天下午正好有外面的人要登录服务器,想了想,普通用户密码就是不想给,然后我就这样做了. useradd alex ---创建账户和密码 passwd alex mkdir /home/alex/.ss ...
- WWF3.5SP1 参考源码索引
http://www.projky.com/dotnet/WF3.5SP1/System/Runtime/Serialization/FormatterServicesNoSerializableCh ...
- Oracle 补丁那些事儿(PS、PSU、CPU、SPU、BP、DBBP…)
当前ORACLE数据库提供两种方式的补丁一种是主动的Proactive Patches和另一种被动的Reactive Patches,其中Reactive Patches是指过去的ONE-OFF Pa ...
- 多线程应用-函数方式(thread)
多线程只能使用一颗CPU,无法发挥多核心的优势.计算密集型用python的多线程效果不明显的,I/O密集型才能看出效果,可以发挥多核优势. GIL是全局资源锁,所以,如果没有涉及到资源的调用,是不会体 ...
- Nexus 3.X(Maven仓库私服)仓库迁移与备份
Linux 仓库迁移 Nexus的构件仓库都保存在sonatype-work目录中,该目录的位置由nexus/conf/nexus.properties配置文件指定.仓库迁移需要两个过程:备份和还原 ...
- DoraHacks的笔记
DoraHacks的笔记
- Xman资格选拔赛-web
variacover 这道题一打开就是源码,主要就是根据源码构造url.其中,它接收的参数只有b,但源码中要获取flag的关键参数是a[0].parse_str()函数的作用是把查询字符串解析到变量中 ...