10 2020 档案
摘要：CSS中background的属性值 background-color background-image background-repeat background-position background-attachment 复合属性:background:background-color back
阅读全文
摘要：padding-box:从 padding区域(含 padding)开始显示背景图像; border-box:从 border区域(含 border)开始显示背景图像; content-box:从 content区域开始显示背景图像 1 <!DOCTYPE html> 2 <html> 3 <hea
阅读全文
摘要：background-clip设置对象的背景图像向外裁剪的区域 padding-box:从padding区域(不含 padding)开始向外裁剪背景; border-box:从border区域(不含 border)开始向外裁剪背景; content-box:从content区域开始向外裁剪背景; t
阅读全文
摘要：background-size设置对象的背景图像的尺寸大小 <length>用长度值指定背景图像大小,不允许负值;=>background-size:X轴尺寸大小 Y轴尺寸大小 <percentage>用百分比指定背景图像大小,不允许负值; auto背景图像的真实大小; cover将背景图像等比缩放
阅读全文
摘要：background-attachment背景关联 设置背景图像是否固定或者随着页面的其余部分滚动 scroll背景图片随页面的其余部分滚动,这是默认; fixed背景图像是固定的; inherit指定background-attachmentI的设置应该从父元素继承 1 <!DOCTYPE htm
阅读全文
摘要：background-position属性设置背景图像的起始位置 xpos ypos第一个值是水平位置,第二个值是垂直,左上角是0,单位可以是长度值px,关键字和百分数值 关键词字成对出现left right top bottom center,如果仅指定一个关键字,其他值将会是'center' X
阅读全文
摘要：指定如何重复背景图像,默认情况下,重复background-image的垂直和水平方向. repat 背景图像将向垂直和水平方向重复,这是默认 repat-x只有水平位置会重复背景图像 repat-y只有垂直位置会重复背景图像 no-repat代表background-image不会重复 inher
阅读全文
摘要：url('图像的url路径地址')图像的url none 表示背景上没有放置任何图像,这是默认值; inherit 指定背景图像应该从那个父元素继承; 一个元素可以引入多张背景图片;指定要使用的一个或多个背景图像,默认情况下,background-image放置在元素的左上角,并重复垂直和水平方向.
阅读全文
摘要：css背景缩写属性可以在一个声明中设置所有的背景属性,css背景图像支持引入多个图像. 主要属性有:background-color,background-image,background-repeat,background-position,background-attachment,backgr
阅读全文
摘要：padding是内边距,会影响我们在浏览器中看到的元素的实际大小,内边距会让元素的内容增大，和其他元素没有关系! margin是外边距,不会影响我们在浏览器中看到的元素的实际大小,外边距不会让元素的内容增大，是和另一个元素的间距! 1 <!DOCTYPE html> 2 <html> 3 <head
阅读全文
摘要：css盒子模型padding和margin的区别: padding是内边距,会影响我们在浏览器中看到的元素的实际大小,内边距会让元素的内容增大，和其他元素没有关系! margin是外边距,不会影响我们在浏览器中看到的元素的实际大小,外边距不会让元素的内容增大，是和另一个元素的间距
阅读全文
摘要：1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style type="text/css"> 7 *{ 8 margin: 0; 9 padding: 0; 10 } 11 .box{
阅读全文
摘要：问题:margin的兼容margin-top的传递 描述:大盒子里面嵌套小盒子,给小盒子添加margin-top值,不但没有实现和大盒子之间的间距,反而传递到大盒子上,导致整体下移 解决兼容性问题: overflow:hidden解决margin-top的传递问题(此处不是溢出隐藏) padding
阅读全文
摘要：并列盒子的margin(双margin的重叠)面试题:一个盒子有上边距,另一个盒子有下边距,会出现margin边距的重叠问题?解决:取大值,并不是他们的相加之和,而是谁大听谁的! <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title
阅读全文
摘要：1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style> 7 .triangle{ 8 width: 0px; 9 height: 0px; 10 border-width: 10
阅读全文
摘要：1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style type="text/css"> 7 .arrow{ 8 width: 20px; 9 height: 20px; 10 b
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> *{ margin: 0; padding: 0; } .content{ width: 100px; heigh
阅读全文
摘要：如上图,padding值是复合属性按照顺时针(上右下做)顺序,其中padding的内边距影响盒子大小的实际宽高 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style type="
阅读全文
摘要：盒子模型的宽度width高度height;宽度和高度的单位px像素,使用%动态计算(自适应和响应式) 1 <div class="pag1"></div> 2 <div class="pag2"></div> 3 <div class="pag3"></div> 4 <div class="pag4
阅读全文
摘要：如上截图,选中h2元素,真实的宽度868px,高度25.2px,受填充内边距padding值5px与边框值1px的影响,最终h2的实际宽高为868X252.2px,其中外边距margin不考虑 什么是css盒子模型？
阅读全文
浙公网安备 33010602011771号