寒假提升 ｜ Day5 CSS 第三部分 #634
giscus[bot]
bot
Replies: 10 comments 11 replies
-
|
过来打卡！ |
Beta Was this translation helpful? Give feedback.
-
|
欢迎欢迎 |
Beta Was this translation helpful? Give feedback.
-
|
|
Beta Was this translation helpful? Give feedback.
-
|
还不错 知识点多看几遍 加油 |
Beta Was this translation helpful? Give feedback.
-
第三道简答
第四道简答
第五道简答
第六道简答
|
Beta Was this translation helpful? Give feedback.
-
|
wow 原来知识点在这里 加油 好棒 |
Beta Was this translation helpful? Give feedback.
-
一.
二.
三. 默写出display常见的值，并且说出对应的特性，并且写出测试案例display:
六. 块级元素在设置padding/border的上下时，有什么特殊的地方？
七.
|
Beta Was this translation helpful? Give feedback.
-
|
打卡 |
Beta Was this translation helpful? Give feedback.
-
|
？ |
Beta Was this translation helpful? Give feedback.
-
|
wk 好棒 好牛 |
Beta Was this translation helpful? Give feedback.
-
|
作业：# Day05作业布置 一. 写出案例，证明CSS属性的继承性二. 写出案例，证明CSS属性的层叠性三. 默写出display常见的值，并且说出对应的特性，并且写出测试案例
四. 总结元素隐藏的方法，并且说出他们的区别
五. 说说你对margin的传递和折叠的理解上下，左右传递折叠 六. 块级元素在设置padding/border的上下时，有什么特殊的地方？块级元素可以设定外边距,上右下左都有效; 行内元素可以设定外边距,左右有效,上下无效。 七. 进行下面的案例练习
css继承-层叠-元素类型css的属性继承
常见的继承属性有哪些css属性的层叠
HTML元素的类型css属性-display
display值的特性（非常重要）
编写HTML时的注意事项
css样式不生效技巧
盒子模型内容和高度
内边距-padding
边框-border
|
Beta Was this translation helpful? Give feedback.
-
|
好棒 好牛 加油gogogo |
Beta Was this translation helpful? Give feedback.
-
|
|
Beta Was this translation helpful? Give feedback.
-
|
很棒 下次记得直接粘贴 |
Beta Was this translation helpful? Give feedback.
-
一. 写出案例，证明CSS属性的继承性
二. 写出案例，证明CSS属性的层叠性一个CSS属性可以多次设置:
三. 默写出display常见的值，并且说出对应的特性，并且写出测试案例block：让元素显示为块级元素;可以让元素独占一行,可以设置宽度和高度,高度默认由内容决定 inline：让元素显示为行内级元素 ;可以和其他行内级元素在同一行,不可以设置宽度和高度,宽度和高度由内容决定 inline-block：让元素同时具备行内级、块级元素的特征 ;可以和其他行内级元素在同一行,可以设置宽度和高度,默认宽度和高度由内容决定 none：隐藏元素 四. 总结元素隐藏的方法，并且说出他们的区别
|
Beta Was this translation helpful? Give feedback.
-
|
好棒 很不错 加油 很详细 |
Beta Was this translation helpful? Give feedback.
-
Day05作业布置一. 写出案例，证明CSS属性的继承性 <style>
.box {
color: red;
text-align: center;
border: 2px solid orange;
}
.box p {
border: inherit;
}
</style>
</head>
<body>
<div class="box">
<p>我是p元素</p>
<div>我是div元素</div>
<span>我是span元素</span>
</div>
</body>
二. 写出案例，证明CSS属性的层叠性 .box {
color: red;
}
.content {
color: blue;
}
.one {
color: green;
}
.first {
color: orange;
}
div {
color: purple;
}
</style>
</head>
<body>
<div class="box content one first">我是div元素</div>
</body>三. 默写出display常见的值，并且说出对应的特性，并且写出测试案例display4个常用值:
特性:
测试display:inline <style>
.box{display: inline; width: 200px; height: 100px;}
</style>
</head>
<body>
<div class="box">我是box</div>
<span>我是span元素</span>
</body>四. 总结元素隐藏的方法，并且说出他们的区别元素隐藏方法:
五. 说说你对margin的传递和折叠的理解传递
折叠
|
Beta Was this translation helpful? Give feedback.
-
|
很棒 很详细啊 加油 |
Beta Was this translation helpful? Give feedback.
-
|
|
Beta Was this translation helpful? Give feedback.
-
|
wow 好认真 自己整理了导图诶，好棒 好厉害 下次记得直接粘贴 |
Beta Was this translation helpful? Give feedback.
-
Day05作业布置一. 写出案例，证明CSS属性的继承性<title>Document</title> <style> .box{ color: red; border: 2px soild black; } .box p{ border: inherit;/*强制性（很少用） */ } </style>我是p元素 我是h1元素二. 写出案例，证明CSS属性的层叠性<title>Document</title> <style> div.box{ color: red !important;/*10000*/ } #main{ color: orange;/*id选择器100*/ } div{color: blueviolet;} /* 元素选择器：1 */ *{ color: aqua;} /* 通配选择器：0 */ </style>我是div元素
三. 默写出display常见的值，并且说出对应的特性，并且写出测试案例display:block-->独自占一行，显示块级元素特性 我是div元素
2222222222
1111
2222222222
四. 总结元素隐藏的方法，并且说出他们的区别display: none 五. 进行下面的案例练习
【轻烟蜜粉】MAKE UP FOR EVER 玫珂菲 HD清晰无痕蜜粉... ￥275 ￥380 4934人已评价 |
Beta Was this translation helpful? Give feedback.
-
一. 写出案例，证明CSS属性的继承性
二. 写出案例，证明CSS属性的层叠性
三. 默写出display常见的值，并且说出对应的特性，并且写出测试案例
四. 总结元素隐藏的方法，并且说出他们的区别
五. 说说你对margin的传递和折叠的理解margin-top传递 如果块级元素的顶部线和父元素的顶部线重叠，那么这个块级元素的margin-top值会传递给父元素 margin-bottom传递 如果块级元素的底部线和父元素的底部线重写，并且父元素的高度是auto，那么这个块级元素的margin-bottom值会传递给父元素 垂直方向上相邻的2个margin（margin-top、margin-bottom）有可能会合并为1个margin，这种现象叫做collapse（折叠） |
Beta Was this translation helpful? Give feedback.
-
Day05 内容回顾一. 伪元素1.1. first-line/(了解)::first-line{ 想要添加的CSS样式 }【强调首行】【可以: 也可以:: 推荐:: 】 ::first-letter{ 想要添加的CSS样式 }【强调首字】【可以: 也可以:: 推荐:: 】 1.2. before/after【在内容前后添加想要的东西 [ 可以批量添加 ] PS:content必须添加】
可以用于添加下面这玩意二. 继承-层叠-元素类型2.1. CSS属性继承
2.2. CSS属性层叠 ### 选择器权重可以叠加
2.3. 元素的类型
display:
2.4. 元素的隐藏方法
2.5. overflow
2.6. HTML嵌套的规范
三. 盒子模型3.1. 认识盒子模型
3.2. contentcontent 属性与 :before 及 :after 伪元素配合使用，来插入生成内容。
3.3. padding内边距: 由内边距边界限制，扩展自内容区域，负责延伸内容区域的背景，填充元素中内容与边框的间距。它的尺寸是 padding-box 宽度 和 padding-box 高度。 边框与内容之间的间距【父子关系】
3.4. border边框【有颜色，有样式，有宽度】
div {
border: 10px solid red;
}3.5. border-radius圆角:允许你设置元素的外边框圆角。当使用一个半径时确定一个圆形，当使用两个半径时确定一个椭圆。这个（椭）圆与边框的交集形成圆角效果。
|
Beta Was this translation helpful? Give feedback.
-
寒假提升 ｜ Day5 CSS 第三部分
一个使用 Python + Selenium + Github Action 实现的截图工具。
https://icodeq.com/2022/abd696b36400/
Beta Was this translation helpful? Give feedback.
All reactions