为了账号安全,请及时绑定邮箱和手机立即绑定

为什么会这样呢?

为什么会这样呢?

http://img1.sycdn.imooc.com//5596b3600001778512910549.jpg

代码如下:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title></title>

<style type="text/css">

*{margin: 0;padding: 0;}

.main{width: 800px;margin: 0 auto;}

.left{width: 300px;height: 500px;background-color: #ccc;position: absolute;left: 0;top: 0;}

.middle{height: 500px;background-color: red;margin: 0 200px 0 300px;}

.right{width: 200px;height: 500px;background-color: #ddd;position: absolute;right: 0;top: 0;}

</style>

</head>

<body>

<div class="main">

<div class="left"></div>

<div class="middle">fklflshfldshldshhfsdhgldgnsdlnvdlgndflgbjfdl;gldgldhsdjkhgkshslkvslkjhglksdnvlsdbsdghldnldsjsdl;j;sd;sj;sjf;ssj</div>

<div class="right"></div>

</div>

</body>

</html>


正在回答

3 回答

(1)没有空格,系统默认为一个单词,所以无法换行。(2)你的容器div没有定位,内部的absolute按照浏览器边缘定位了,所以间距很宽。

0 回复 有任何疑惑可以回复我~

还有更好的方法:

word-wrap:break-word


1 回复 有任何疑惑可以回复我~

在这些字母里面敲几个空格就能换行

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
如何用CSS进行网页布局
  • 参与学习       209624    人
  • 解答问题       1153    个

用最简洁的案例教你布局的那些知识,这是前端工程师基本技能

进入课程

为什么会这样呢?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信