margin-right

margin-right


<!DOCTYPE html>

<html>

<head>

<title> </title>

<style type="">

div{

width: 100%;

height:200px;

margin-right: 100px;

background-color:red; 

}

p{

margin-right: 100px;

background-color: red;

}

</style>

</head>

<body>

<div>测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传</div>

<p>

测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传测试上传

</p>

</body>

</html>



http://img1.sycdn.imooc.com//climg/5d3ad5a200018b3418920763.jpg

正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

3回答
qq_慕UI0173712 2019-07-29 09:07:03

原因一:你给与了div宽度为100%。原因二:一个div标签是会占据页面一行的位置。结论:所以此时你给的margin-right是不起作用的。而p标签:一个p标签是识别内容而定的,你给多少内容,他的宽度就有多长,所以在这里,你给了p标签100px,当然可以向右移动,因为p标签与div标签在页面布局中所占位置是不一样的。不懂可以继续质问我~~望采纳~~~



好帮手慕阿满 2019-07-26 18:56:00

同学你好,同学给div设置了宽度为100%,所以margin-right的效果无法显示,同学可以去掉width:100%再试试。

如果我的回答解决了你的疑惑,请采纳。祝:学习愉快~

提问者 shameL 2019-07-26 18:28:55

为什么margin-right 在p标签能往右移动,div不行呢


  • 原因一:div你给予了100%的宽度,他是会自动识别整个页面的宽度。原因二:div在页面中,一个标签就会占据了一行的位置。结论:你给与了margin-right因为上述的原因就会不起作用了。
    2019-07-29 09:03:01
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师