网页资讯视频图片知道文库贴吧地图采购
进入贴吧全吧搜索
html吧 关注：182,154贴子：1,338,730
  • 7回复贴，共1页

求大神教我，看着简单，但就是不明白，如图


源码就是3个p标签加里面的文本，第一个没有空格，第二个给了几个（如图），第三行是一段文字。
p{
width:200px;
border:1px solid red;
margin:25px 0;
}
我不明白为什么会出现第一种和第二种情况，空格起什么作用


代码全贴出来看看


<!DOCTYPE html>
<html>
<head>
<title>垂直外边距合并</title>
<META charset="utf-8">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<p>DashboardDashboardDashboardDashboardDashboardDashboardDashboardDashboardDashboardDashboard</p>
<p>Dashboard Dashboard Dashboard Dashboard Dashboard Dashboard Dashboard Dashboard Dashboard Dashboard ashboardDashboardDashboardDashboardDashboardDashboardDashboardDashboardDashboard</p>
<p>我另起一段了,那么与上一段最后一行的间距需要对段落元素设置外边距margin。</p>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/script.js"></script>
</body>
</html>


*{ margin:0; padding:0;}
p{
width:200px;
margin:25px 0;
border:1px solid red;
}


我也不明白……


我查阅了相关资料。如p,div这些标签，里面的无文字分隔符（如空格，Tab制表符，中文字或标点）分隔的一串数字或字母不会自动换行。遇到文字分隔符就自动换行，中文自动换行。把空格解析为换行，的确让人有些不解……要所有都自动换行，加CSS样式word-break:break-all;


英文那个第一行，中间没有空格，系统认为你那是一个单词，你见过把一个单词拆分成两半的吗。。。。把每个单词写完后面加上一个空格就够了，就能够换行了，汉字的话当然就是自动换行了。


扫二维码下载贴吧客户端

下载贴吧APP
看高清直播、视频！
  • 7回复贴，共1页
分享到: