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;我也验证过哟!

 

转载于:https://www.cnblogs.com/AliceX-J/p/4903913.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值