前言:发现以前写的就像是笔记,哪像博客啊,这里再次修改。

问题描述: 在固定宽度的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标签不自动换行原因的更多相关文章

  1. 使用echart的雷达图的时候,如果文字越界的解决办法记录,标签文字自动换行

    使用echart的雷达图的时候,如果文字越界的解决办法记录,标签文字自动换行 前几天项目中有一个图表的是用echart生成的,遇到一个问题,就是在手机端显示的售时候,如果文字太长就会超出div,之前的 ...

  2. 【HTML】让<pre>标签文本自动换行

    利用<pre></pre>这个标签可以将其包起来的文字排版.格式,原封不动的呈现出来. 也就是说你输入的东西被原封不动的输出,包括你输入的空格之类的,不用 和<BR> ...

  3. 导航栏下a标签失效的原因

    前天我一直没找到失效的结果,就在刚才,我用不同的浏览器打开我编写的网页,有一个浏览器的图片循环播放效果错位了,我觉得就是它上边的div把他挤下来了.正如前天网上看到的高手的们的说法.我用firebug ...

  4. 自定义View(四) ViewGroup 动态添加变长Tag标签 支持自动换行

    欲实现如下效果: 思路很简单就2步: 1.测量出ViewGroup的大小 2.找出子View的位置 若要实现动态添加标签view,就要实现ViewGroup的onMeasure().onLayout( ...

  5. Android 自定义View修炼-Android中常见的热门标签的流式布局的实现

    一.概述:在日常的app使用中,我们会在android 的app中看见 热门标签等自动换行的流式布局,今天,我们就来看看如何 自定义一个类似热门标签那样的流式布局吧(源码下载在下面最后给出哈) 类似的 ...

  6. HTML -- 标签记录(随着学习不断更新)

    此篇博文主要记录一些标签的常用属性 Font标签 size:字体大小 color:颜色 face:字体 <!DOCTYPE html> <html> <head> ...

  7. IOS动态自适应标签实现

    先上效果图 设计要求 1.标签的宽度是按内容自适应的 2.一行显示的标签个数是动态的,放得下就放,放不下就换行 3.默认选中第一个 4.至少选中一个标签 实现思路 首先我们从这个效果上来看,这个标签是 ...

  8. JSTL标签库的基本教程之核心标签库(一)

    JSTL介绍 Java Server Pages Standard Tag Libray(JSTL):JSP标准标签库,它封装了JSP应用的通用核心功能.JSTL支持通用的.结构化的任务,比如迭代,条 ...

  9. HTML的各种基本标签

      一 .head中的各种标签                1.       <!DOCTYPE html><html>文档类型声明   声明当前文件是一个HTML5文件文档 ...

随机推荐

  1. Ubuntu加入opencv库的环境变量

    1.用gedit打开/etc/ld.so.conf 终端输入: sudo gedit /etc/ld.so.conf 文件末行加入:include /usr/loacal/lib .然后终端执行指令: ...

  2. 根据自定义区域裁剪ArcGIS切片地图服务

    切片地图服务是访问地图最快捷的服务方式.假如要根据地理区域对切图进行访问控制,往往只能针对不同地理区域制作相应的地图,并发布为切片地图服务.而一般在切图的时候又是按全区域实施的,所以给切片管理者造成不 ...

  3. android:项目迁移error:Please change caller according to com.intellij.....

    迁移到Android Studio中的项目,在运行时有时会在Event Log中报这种错: Please change caller according to com.intellij.openapi ...

  4. Android微信支付—注意事项

    坑点一:PayReq的参数 sign的生成 PayReq对象有个参数为packageValue 而sign生成时要用到packageValue,但是对应的Key是package,这里的key容易弄错 ...

  5. phpAdmin修改密码后拒绝访问

    [phpMyadmin没配置正确] 解决方法: 1.打开 phpMyadmin 目录找到config.inc.php文件2.查找到$cfg['Servers'][$i]['password']=''3 ...

  6. phantomjs在centos7下的安装

    http://phantomjs.org/download.html 下载 Linux 64-bit 解压 tar jxvf 安装包名称.tar.bz2 pwd 查看路径 ln -sf phantom ...

  7. leetcode 之 Same Tree

    1.题目描述 Given two binary trees, write a function to check if they are the same or not. Two binary tre ...

  8. 12.2Data Guard新特性--使用DBMS_DBCOMP.DBCOMP数据比较

          Oracle Data Guard会主动对Hot数据(数据正被读取或修改)执行验证, 无论是primary还是standby,但对于那些Cold数据不会做任何检查和校验.所以在12.2版本 ...

  9. SQL语句还原数据库并移动文件到指定路径

    用SQL语句还原数据库时如果不指定数据库文件的存储路径,则默认把数据文件和日志文件存放到与原数据库相同的文件路径中,这样可能会产生错误,比如执行下面的语句: restore database Smar ...

  10. 制作 OS X El Capitan 启动盘

    制作 OS X El Capitan 启动盘 1. 下载系统盘的dmg格式 2. 直到出现了 3. 在命令行中找到 Install OS X El Capitan.app 4. 格式化你的U盘(U盘名 ...