html盒子详解
来源:互联网 发布:ida软件 编辑:程序博客网 时间:2024/06/07 14:34
hmtl盒子模型
html中的每一个标签都是一个盒子,并且这个盒子有四个属性,如下:
- content(内容) 一般指网页中的文字或图片
- padding(内边距,填充) 盒子与内容的间隙,且会增加盒子的大小
- border(边框) 盒子本身的边框
- margin(外边距,边界) 盒子之间的间隙
效果如图所示:
代码如下, <html lang="en">
<head>
<meta charset="UTF-8">
<title>盒子模型</title>
<style>
*{
/*清除所有盒子的外边距*/
margin: 0;
padding: 0;
}
div{
width: 300px;
height: 200px;
background-color: antiquewhite;
/*设置边框*/
border: 5px solid mediumpurple;
/*设置内边距 上 右 下 左*/
padding: 10px 5px 8px 15px;
/*设置外边距*/
margin: 10px;
}
</style>
</head>
<body>
<div>我是一个盒子</div>
</body>
</html>
- html盒子详解
- html 盒子模形
- HTML盒子模型
- html基础3-盒子
- html盒子模型
- html css 盒子原理
- html 弹性盒子
- html盒子模型
- html盒子模型
- HTML盒子模型
- Html—盒子模型
- html盒子模型
- HTML中的盒子阴影
- html立体盒子
- html css盒子模型
- HTML中的盒子链接
- html 盒子模型基础(外边距的重叠问题详解)(三)
- html 盒子模型基础(高度塌陷问题,BFC详解)(六)
- new mysql modify password
- 用IDEA反向生成javabean
- 微信公众号开发--js关闭浏览器回到公众号对话窗口
- 红外接收原理
- 多边形的重心
- html盒子详解
- thinkphp3.2.3 成功对接支付宝接口案例(转载)
- ajax链接数据库实例
- nginx的缓存
- Java协程框架--Kilim工作原理
- HTML基础
- 成为一个Java的架构师要学习哪些知识
- 《大型多人在线游戏开发》读书笔记
- js学习网站