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

问题描述: 在固定宽度的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. dnspod域名解析设置

    time: 2016-01-8 10:30     因为我的博客是用Github page搭建的,所以要把域名和Github_name.github.io的URL联系起来.本人实在小白一个,就纪录一下 ...

  2. arcgis英文版补丁下载地址

    http://support.esri.com/zh-cn/downloads/patches-servicepacks/list/productid/160

  3. JSON学习笔记-2

    JSON的语法 1.JSON 数据的书写格式是:名称/值对. "name" : "我是一个菜鸟" 等价于这条 JavaScript 语句: name = &qu ...

  4. Android使用xml文件中的array资源

    Android中有种使用数组的非常简单的用法,在xml文件中获取. 创建数组资源 在value目录下创建arrays.xml文件 然后在arrays.xml文件中使用<string-array& ...

  5. PAT乙级01

    1001 害死人不偿命的(3n+1)猜想 (15)(15 分) 卡拉兹(Callatz)猜想: 对任何一个自然数n,如果它是偶数,那么把它砍掉一半:如果它是奇数,那么把(3n+1)砍掉一半.这样一直反 ...

  6. leetCode题解之寻找一个数在有序数组中的范围Search for a Range

    1.问题描述 Given an array of integers sorted in ascending order, find the starting and ending position o ...

  7. Windows+Git+TortoiseGit+COPSSH 安装教程及问题收集

    准备工作: 1. git-1.8.1.2-preview20130201.exe 下载地址: https://code.google.com/p/msysgit/downloads/list 2. C ...

  8. spider-抓取页面内容

    # -*- coding: UTF-8 -*- from HTMLParser import HTMLParser import sys,urllib2,string,re,json reload(s ...

  9. AppHangB1:explorer进程停止与Windows交互

    现象:Windows 7,打开 “计算机” 的时候,资源管理器卡死,如图所示. 解决方法:卸载 CAD迷你看图软件,利用 CCleaner 清除注册表.

  10. 关于RSA、公钥、私钥、加密、签名的那些概念

    前言 作为一名程序员,经常会听到加密解密之类的词.而非对称加密技术,应用的非常广泛.本文不写加密技术的原理,只是希望以一个简单的类比,让大家了解非对称加密中常见词的概念,以及它的作用. 介绍 在RSA ...