<!--页面中的组成部分通常随便打开一个网页,有文字,图片,视频,表格,音频,表单(注册信息) css 属性/尺寸/边框/背景 1.css的尺寸属性,就是大小width max-width min-widthheight max-height min-height 2.css的边框属性border-style 边框风格 none:无边框。 border-color和boder-width都将被忽略 hidden:隐藏边框。 dotted:点状边框。 dashed:虚线边框。 solid:实线边框。 double:双线边框。两条单线与其间隔的和等于指定的border-width的值。 groove:3D凹槽轮廓。 ridge:3D凸槽轮廓。 inset:3D凹边轮廓。 outset:3D凸边轮廓。 border-color 边框颜色border-width 边框宽度 3.内边距属性padding-left: 20px; 左边距padding-top: 50px; 上边距padding-right: 100px;右边距padding-bottom: 150px;下边距 /*复合属性*/padding: 值; 上下左右 /*padding: 20px;*//*padding: 20px 40px;*/ 上下 左右/*padding: 20px 40px 60px;*/ 上 左右 下padding: 10px 20px 30px 40px; 上 右 下 左 4.css背景属性 --> <!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>张仁国杨静结婚啦</title> <style type="text/css"> .item { /*设置元素的宽高*/ /*width: 300px;*/ /*max-width: 300px;*/ /*min-width: 300px;*/ width: 600px; /*height: 400px;*/ /**/ /*border 边框*/ border-style: solid; border-color: #f90; border-width: 1px; /*复合属性*/ /*border: 2px solid red;*/ /*内边距 padding*/ padding-left: 20px; padding-top: 50px; padding-right: 100px; padding-bottom: 150px; /*复合属性*/ /*padding: 20px;*/ /*padding: 20px 40px;*/ /*padding: 20px 40px 60px;*/ padding: 10px 20px 30px 40px; } </style></head><body> <h1>CSS的尺寸属性 边框属性 内边距</h1> <hr> <div class="item"> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid aperiam consectetur corporis dolorum, earum eos et explicabo fuga harum id itaque maiores nam nobis possimus quasi ratione suscipit totam vitae? </div> </body></html>
原文地址:https://www.cnblogs.com/zhangrenguo/p/10080934.html
时间: 2024-07-28 13:27:10