返回css-box......登陆

css-box-model小案例

Johnson2018-10-26 18:47:0664

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />

<title>Box Model</title>

<style type="text/css" media="screen">

body{

color:#FFF;text-align:center;

}

.box{width:200px;height:200px;background-color:#1E9FFF;margin:0px auto;padding:0px 0px;border-radius:10px;}

.box1{width:300px;height:300px;background-color:#FF5722;margin:0 auto;padding:0px 0px;border-radius:10px;}

.box2{width:350px;height:350px;background-color:#2F4056;margin:0 auto;padding:0px 0px;border-radius:10px;}

.box3{width:400px;height:400px;background-color:#5FB878;margin:0 auto;padding:0px 0px;border:2px solid #c2c2c2;box-shadow:5px 5px 5px gray;border-radius:10px;}

</style>

</head>

<body>

<div>

外边距

<div>

边框

<div>

内边距

<div>

内容

</div>

</div>

</div>

</div>

</body>

</html>



最新手记推荐

• 用composer安装thinkphp框架的步骤• 省市区接口说明• 用thinkphp,后台新增栏目• 管理员添加编辑删除• 管理员添加编辑删除

全部回复(0)我要回复

暂无评论~
  • 取消回复发送
  • PHP中文网