前端二十九:两个盒子居中的练习
生活随笔
收集整理的這篇文章主要介紹了
前端二十九:两个盒子居中的练习
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
<!doctype html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><style>/* 有一個(gè)大的div,寬500,高300.在大的div中有一個(gè)小的div,寬200,高100現(xiàn)在需要將小的div放在大的div中間位置(水平和上下都居中),并且兩個(gè)盒子的寬高都不能改變.*//*方法一:.father{width:200px;height: 100px;border: 1px solid red;padding: 100px 150px;}.son{width:200px;height: 100px;border: 1px solid blue;} *//*方法二:*/.father{width:350px;height: 200px;border: 1px solid red;padding-top: 100px;padding-left: 150px;}.son{width:200px;height: 100px;border: 1px solid blue;} </style>
</head>
<body><div class="father"><div class="son"></div></div>
</body>
</html>
?
總結(jié)
以上是生活随笔為你收集整理的前端二十九:两个盒子居中的练习的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 数据结构:链表
- 下一篇： 数据结构:链表面试题