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

长串英文字符之间没有空格,整串都显示在一行,撑破了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)
江山如画的头像江山如画管理团队
如何为需要打印的网页设置单独的css样式
上一篇 2019年11月20日 下午7:37
人工智能领域的典型的应用和研究方向有哪些?
下一篇 2019年11月21日 上午9:22

99%的人还看了以下文章

  • Marquee标签实现跑马灯、滚动公告、通知效果

    1.Marquee基本语法 <marquee> … </marquee> 实例演示:会移动的文字(Marquee) <marquee>啦啦啦,我会移动耶!</marquee> 2.文字移动属性 (1)方向 :direction=# #=left, right,up,down 例: <marqu…

    2019年2月26日
    11.9K0
  • Marquee标签制作滚动公告、新闻列表

    效果演示 《Marquee标签实现跑马灯、滚动公告、通知效果》 Marquee标签制作滚动公告、新闻列表 <!doctype html> <html> <head> <meta charset=”utf-8″> <title>marquee实现的滚动公告|www.125jz.com</titl…

    2019年2月28日
    11.6K0
  • CSS border-radius 深入学习(含可视化生成工具)

    CSS border-radius 深入学习(含可视化生成工具)CSS border-radius 深入学习(含可视化生成工具)CSS border-radius 深入学习(含可视化生成工具)CSS border-radius 深入学习(含可视化生成工具)

    没有学过CSS border-radius 的同学,请阅读《css实现圆角矩形、半圆、圆形效果—border-radius使用详解》一文。border-radius 写法: .box{ border-radius: 30%; /* 也可以用PX代替 */ } 矩形的四角会变为相应数值的圆角,如下图: 只输入一个数值,所有角都会被四舍五入,若要固定值可以使用 …

    2019年10月17日 网页制作
    11.8K0
  • 第7课:元素的分类与标识(class和id)

    有时,你希望对特定元素或者特定一组元素应用特殊的样式。在这一课,我们将深入学习如何利用class和id来为所选元素指定属性。 如何实现为网站上许多标题中的某一个单独应用颜色?如何实现把网站上的链接分为不同的类,并对各类链接分别应用不同的样式?这只是本课将解决的诸多问题中的最具代表性的两个问题。 用class对元素进行分类 比方说,我们有两个由链接组成的列表。…

    2020年2月25日
    6.4K0
  • 响应式布局和自适应的区别

    客户端,PC、平板、手机,各种尺寸,要给电脑PC和手机分别设计不同的网页吗?要给每一个手机分别设计一个网页吗? 不需要,因为有了响应式布局。 响应式布局被大家熟知的一个重要原因就是Twitter开源了bootstrap。。 响应式布局和自适应的区别: 自适应是为了解决如何才能在不同大小的设备上呈现相同的网页。 手机的屏幕比较小,宽度通常在600像素以下,pc…

    2019年10月15日
    5.3K0
  • css布局基础:定位练习1

    主要知识点: 1、5种常用定位:静态定位/相对定位/绝对定位/固定定位/吸附定位(磁铁定位) position:static/relative/absolute/fixed/sticky。 2、除静态定位外,都可以用left/top/bottom/right/z-index属性进行移动。 效果图: 效果说明:故宫文字段落设置背景色黑色透明,覆盖在图片底部。 …

    2020年4月4日
    7.9K0

发表回复

登录后才能评论