1 1、在css标签内，通过body元素名称定义它的样式。 2、在css标签内，使用background属性设置body的背景图4.jpg，不重复显示(no-repeat)，居中显示（center）。 4、在css标签内，再将background-size属性设置为cover，让背景图基于容器大小伸缩，将background-attachment属性设置为fixed,固定背景图的位置。 3...
.body{min-width:600px;}.container{padding-left:220px;padding-right:220px;}.left{float:left;width:200px;height:400px;background:red;margin-left:-100%;position:relative;left:-220px;}.center{float:left;width:100%;height:500px;background:yellow;}.right{float:left;width:200px;height:400px;b...
7 最后稍微整理一下代码 .nav ul{width:980px;margin:0px auto;height:38px;padding:0;}.nav ul li{float:left;}.nav ul li a{width:80px;height:28px;line-height:28px;background:red;color:#FFF;margin:5px 10px;font-size:12px;display:block;text-align:center;text-decoration:none; }.nav...
initial-scale=1.0"><title>盒子</title><style>.box{width:200px;height:200px;border:2px solid black;padding:30px;margin:50px;}</style></head><body><divclass="box"><span>你好</span></div></body>
body { background: url("../images/family-one.jpg") no-repeat center center fixed; -moz-background-size: cover; -o-background-size: cover; -webkit-background-size: cover; background-size: cover; } .rascal { position: relative; background: rgba(255, 255, 255, 0.3); overflow: hidden...
justify-content: center; align-items: center; } 效果如下: 这种方式特别适应于让Icon图标在容器中水平垂直居中,不同的是在Icon图标容器上显示设置 display: inline-flex。比如下面这个示例: <!-- HTML --> <div class="flex__container"> <svg> </svg> ...
body{background-color:red;/*背景颜色设置为红色,背景图覆盖不完全的时候,剩余的有背景颜色填充*/background-image:url("bg.jpg");/*url中添加的是图片路径(相对和绝对路径)*/background-repeat:no-repeat;/*设置背景图不重复*/background-attachment:fixed;/*背景图固定*/background-position:center center;/...
/*center left right bottom top*/ /*transform-origin: center center;*/ /*transform-origin: left top;*/ transform-origin: center bottom; } .div1:hover{ transform: rotate(45deg); } </style> </head> <body> <div class="main"> <div class="div1"> </div> </div> </body> </html...
span2{ width: 70px; height: 100%; float: left; background: deeppink; text-align: center; opacity: 0.8; } </style> </head> <body> <div id="div1"> <div id="div2"> <div class="box" > <div class="footer"> <div class="span1">安踏体育运动</div> <div class="span2">$...
body { background-color: rgb(150, 234, 213); background-image: url(http://zhanghonglun.cn/blog/wp-content/uploads/2015/09/bg.jpg); background-repeat: no-repeat; background-size: cover; background-attachment: fixed; background-position: center; } 如果使用图片作为背景,则在不影响清晰度的...