怎么让一长串英文字符自动换行?

长串英文字符之间没有空格,整串都显示在一行,撑破了div,甚至跑到屏幕外了,如何解决?

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>怎么让一长串英文字符自动换行?|www.125jz.com</title>
<style type="text/css">
div{ width:300px; border:1px solid #999;}
</style>
</head>

<body>
<div>artificialintelligenceartificialintelligenceartificialintelligenceartificialintelligence</div>
</body>
</html>

运行如下图所示:
怎么让一长串英文字符自动换行?

解决办法: 设置一个css属性:word-break: break-all; 即可。

div{ width:300px; border:1px solid #999;word-break: break-all; }

怎么让一长串英文字符自动换行?

125jz网原创文章。发布者:江山如画,转载请注明出处:http://www.125jz.com/4297.html

(0)
江山如画的头像江山如画管理团队
上一篇 2019年11月20日 下午7:37
下一篇 2019年11月21日 上午9:22

99%的人还看了以下文章

  • 第15课:最后提示

    祝贺!你已经进入最后一课了! 我已经学到全部知识了? 如果你已经学完以上教程,恭喜你,你已经学到了很多关于HTML的知识,并且完全有能力创建自己的网站!不过,你所学到的只是基础知识,还有许多内容需要掌握。但是你已经为进一步学习打下了坚实的基础。 在最后这一课中,我们将给予一些最后提示: 首先,在HTML文档中,应保持正确的顺序与结构。令你的HTML文档具有良…

    2018年1月18日
    2.6K0
  • 跟永哥学HTML5(4):正确使用HTML5的header、hgroup和section

    在上一章HTML5新增语义化元素的使用中我们讲解了HTML新增的标签,并举例给出如何使用。但真正从HTML4转变到HTML5编程,并不是那么简单的事情,很多初学者没有真正了解这些标签,或错误使用HTML5的标签。这节课就给大家讲解常见的HTML5标签错误使用写法,帮助大家学会正确使用HTML5的header、hgroup和section。 1、只在需要的时候…

    2018年2月3日
    4.4K0
  • 一句代码给图片加倒影-CSS3

    本文使用纯CSS代码给图片加倒影,CSS代码 : img { -webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(250, 250, 250, 0.1))); } 效果如下图所示: 完整代码: &lt…

    2019年8月18日
    2.9K0
  • 太赞了!推荐2个多彩渐变配色网站

    1、根据心情和情绪生成的渐变色 https://gradienmood.posandu.me/ 色彩是拥有情绪的,但是有情绪的色彩有不一定仅仅只有一种颜色。这个名为 Gradien Mood 的渐变色网站会将不同感觉和渐变色搜集起来,其中有的渐变色甚至拥有极为复杂的情绪,而你需要做的,就是输入你想传递的情绪,然后就能搜到相关的情绪和色彩,包括渐变的 CSS …

    2023年1月18日
    2.6K0
  • CSS3:Box-shadow 教程及实例-制作逼真的图片阴影效果

    box-shadow属性的基本用法 使用Box-shadow制作逼真的图片阴影效果 使用伪元素::before和::after,我们能实现非常逼真的只有图片才能实现的阴影效果。 HTML: <div class=”box11 shadow”></div> CSS: .box11 { width: 300px; height: 100p…

    2019年1月5日 网页制作
    4.6K0
  • 手把手教你做响应式网页,响应式布局实例入门(精)

    刚接触响应式布局的童鞋会感觉响应式布局很高大上,很难,但实际上只用CSS就能实现响应式布局。今天中国网页设计通过一个响应式布局实例,手把手教你如何制作响应式网页。 响应式布局(Responsive Layout) 响应式布局分别为不同的屏幕分辨率定义布局,同时,在每个布局中,应用流式布局的理念,即页面元素宽度随着窗口调整而自动适配。 响应式布局实例 当窗口大…

    2018年7月28日
    4.8K0

发表回复

登录后才能评论