web前端基础（盒子模型）

最新推荐文章于 2024-08-09 16:03:47 发布

Lxq0218

最新推荐文章于 2024-08-09 16:03:47 发布

阅读量351

点赞数

文章标签： html css3 web

本文链接：https://blog.csdn.net/Lxq0218/article/details/117225976

版权

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		
	    <style type="text/css">
	    	<!--有些元素有一些默认样式，body默认8px外边框-->
	    body{
	    	margin: 0;
	    	width: 350px;
	    }
	    div{
	    	border: 1px solid red;/*边框：宽度1px样式实线，红色*/
	    	width: 100px;/*宽度*/
	    	height: 100px;/*高度*/
	    	display: inline-block;
	    }
	    .div1{
	    	/*padding:10px;上右下左  都是10*/
	    	/*padding-top:10px;上内边距：10*/
	    	padding:10px 20px;/*上下10px,左右20px*/
	    }
	    .div2{
	    	margin-left: 10px;
	    }
	    div2,div3,div5,div6,div8,div9{
	    	
	    }
	    .div9{
	    	/*border-bottom-left-radius:20px;/*左下角*/
	    	/*border-top-left-radius:20px;*//*左上角*/
	    	border-radius: 10px;
	    }
	    .div8{
	    	border-radius:10px;
	    	background-color: darkgoldenrod;
	    }
	    </style>
	</head>
	<body>
		<div class="div1">中国人民解放军东部战区组织兵力对美舰穿航行动全程跟踪监视</div>
		<div class="div2">div2</div>
		<div class="div3">div3</div>
		<div class="div4">div4</div>
		<div class="div5">div5</div>
		<div class="div6">div6</div>
		<div class="div7">div7</div>
		<div class="div8">div8</div>
		<div class="div9">div9</div>
	</body>
</html>

Lxq0218

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
web前端基础（盒子模型）

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css">  body{ margin: 0; width: 350px; } div{
复制链接

扫一扫