关于margin是负值的问题

来源：3-4 通用图文组件类-H5ComponentBase（开发准备）

专注前端的全栈

2016-06-04

在第三章第四节中，iPhone的div的CSS居中50%左和50%的上后，为什么还要加一句margin：-270px 0 0 -170px这句呢？不太懂，作用是什么，我想了解下

写回答

1回答

Lyn

2016-06-06

这个是水平&垂直剧中法。

元素在容器中设置为 left:50%,top:50%；后，会以自身的左上角为定点，进行偏移，此时，左上角订单在容器的正中心。

然后把元素自身的宽度的一半进行负左偏移（正左偏移整体会向右走），那么水平角度上，这个元素就剧中了，垂直的同理。

你可以尝试修改

margin: 0 0 0 0;

然后再修改

margin : -270px 0 0 0 ;

然后再修改

margin : -270px 0 0 -170px ;

看看效果。

专注前端的全栈

对哦，忘记把宽度和高度给算进去了，谢谢老师

2016-06-06

共1条回复

Web App用组件方式开发全站

用HTML5/CSS3/JS流行技术，实现移动端可视化数据报告

3164 学习 · 516 问题

相似问题

回答 1

回答 4

回答 1

回答 1

回答 3