一.问题产生的原因

  当我们为div标签声明了宽度,但是仍然会出现文本越界的情况,不知道大家有没有发现,只有文本内容为单词或者纯数字的时候才会出现这种情况为此我特意测试了两种情况,结果如下:

  ①当文本内容为纯数字或者字母:

  ②当文本内容为汉字:

    所以我们可以得出结论:浏览器在解析我们页面的时候,给这一串数字当成一个词了,这样就不会自动切断字符串而进行换行。

二.解决方法

  ①word-wrap:break-word     (例如div宽200px,它的内容就会到200px自动换行)

  ②word-break:break-all        (相比较于上面的方法,这种方法的好处在于假如在宽度的范围内的临界区存在一个完整的单词,它会保留一个完整的单词自动换行)

  下面让我们来测试一下

  这样我们就可以看见字母自动换行了!!!

关于网站开发中div标签中设置宽度后其中文本溢出的原因和解决方法的更多相关文章

  1. asp.Net2.0中TextBox设置只读后后台获取不到值的解决方法

    http://www.cnblogs.com/yxyht/archive/2013/03/02/2939883.html   ASP.NET中TextBox控件设置ReadOnly="tru ...

  2. .NET中TextBox控件设置ReadOnly=true后台取不到值的解决方法

    在.NET 2.0 下,当页面上的某个TextBox 设置了属性ReadOnly="True"时,通过客户端脚本给其赋值后,在后台代码中访问其Text属性却无法获得该值.经过尝试, ...

  3. UIView 设置alpha后, 子view也随着变化alpha, 解决方法

    //        _closeContainerBar.alpha = 0.7; _closeContainerBar.backgroundColor = [[UIColor blackColor] ...

  4. HTML中Meta标签中http-equiv属性小结

    HTML中Meta标签中http-equiv的用法: <meta http-equiv="这里是参数" content="这里是参数值"> 1.Ex ...

  5. HTML中Meta标签中http-equiv属性

    HTML中Meta标签中http-equiv的用法: <meta http-equiv="这里是参数" content="这里是参数值"> 1.Ex ...

  6. 关于django中input标签中file类型以及开路由

    0825自我总结 关于django中input标签中file类型 1.input提交图片实时展示 <img src="/static/img/default.png" wid ...

  7. odoo开发笔记 -- div标签代替odoo button写法

    odoo开发笔记 -- div标签代替odoo button写法 并调用自定义js <footer> <div id="confirm_request_cloud_repo ...

  8. Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法

    Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法 2014-03-27 11:44:46|  分类: Easy UI|举报|字号 订阅     可以使用$.parser.pa ...

  9. 从客户端中检测到有潜在危险的 Request.Form 值的问题的解决方法。

    在controller控制器里面添加[ValidateInput(false)]         [ValidateInput(false)]        public ActionResult m ...

随机推荐

  1. (转)Python3之requests模块

    原文:https://www.cnblogs.com/wang-yc/p/5623711.html Python标准库中提供了:urllib等模块以供Http请求,但是,它的 API 太渣了.它是为另 ...

  2. 抓包和测试Api类工具

    1.PostMan  测试api 2.Fiddler4抓包工具使用教程一

  3. spring mvc 数据转换

    项目目录结构 User.java package org.mythsky.springmvcdemo.model; import org.springframework.format.annotati ...

  4. linux解压zip乱码解决方案

    1.向系统添加windows下的字符编码: sudo vim  /var/lib/locales/supported.d/local 添加一下编码: zh_CN.GBK GBK zh_CN.GB231 ...

  5. 利用cygwin创建windows下的crontab定时任务

    要求 必备知识 熟悉基本编程环境搭建. 运行环境 windows 7(64位); Cygwin-1.7.35 下载地址 环境下载 什么是Cygwin Cygwin是一个在windows平台上运行的类U ...

  6. es-02-elasticsearch安装及遇到的问题

    最近因为工作需要, 又使用到了es, 版本已经从当年的2.4 更新到了6.3 基本上解压即用, elasticsearch 5.x 版本, 在 centos6下, 很多性能不能够发挥, 建议 cent ...

  7. mac 安装 python mysqlclient 遇到的问题及解决方法

    在 mac 上安装 mysqlclient 遇到了一些问题,查找资料很多人都遇到了同样的问题.通过资料和试验,成功了.这里记录一下,希望帮到遇到同样问题的人. 本人使用python3, 安装步骤如下: ...

  8. Tomcat学习总结(2)——Tomcat使用详解

    一.Tomcat服务器端口的配置 Tomcat的所有配置都放在conf文件夹之中,里面的server.xml文件是配置的核心文件. 如果想修改Tomcat服务器的启动端口,则可以在server.xml ...

  9. SpringMVC之REST

    REST: 即 Representational State Transfer.(资源)表现层状态转化.是目前最流行的一种互联网软件架构.它结构清晰.符合标准.易于理解.扩展方便,所以正得到越来越多网 ...

  10. es6学习笔记3--解构和对象

    1.解构 在接收数据的地方(比如赋值的左边),解构使你使用模式去获取部分数据. 下面的代码是解构的一个例子: let obj = { first: 'Jane', last: 'Doe' }; let ...