任务目标
实践HTML/CSS布局方式
深入了解position等CSS属性
任务描述
实现如示例图（http://7xrp04.com1.z0.glb.clouddn.com/task_1_4_1.png）的效果
灰色元素水平垂直居中，有两个四分之一圆位于其左上角和右下角。
任务注意事项
思考不同情况下（如灰色高度是根据内容动态变化的）水平垂直居中的解决方案。
动手试一试各种情况的组合，父元素和子元素分别取不同的 position 值。思考 position 属性各种取值的真正含义，尤其是 absolute 究竟是相对谁而言的。
注意测试不同情况，尤其是极端情况下的效果。
调节浏览器宽度，灰色元素始终水平居中。
调节浏览器高度，灰色元素始终垂直居中。
调节浏览器高度和宽度，黄色扇形的定位始终准确。
其他效果图中给出的标识均被正确地实现，错一项扣一分。
参考资料
http://www.w3cplus.com/css/advanced-html-css-lesson2-detailed-css-positioning.html：大漠老师手把手教你，这次彻底搞懂定位问题
任务目标 实践HTML/CSS布局方式 深入了解position等CSS属性 任务描述 实现如示例图（http:/...
健文导图学习总结概况及感悟。 为期21天的训练，即将进入尾声。 在这二十一天里面，深切的感受到了健文导图的落地。老...
学习营养基础班《儿童营养素》。答题通过之后将内容截图上传小打卡程序并分享收获与心得，即完成打卡！ 截图如下： 操作...
这是刻意练习第二十一天（3.25），据说二十一天可以养成一个习惯，我想如果没有任务，可能明天我也就忘了，或许二十一...
身负任务尚未勤，美酒飘来视重臣。 莫管三七二十一，醉卧云中看浮尘。
今天是什么日子 起床：6:10分 就寝：23:20 天气：晴朗 心情：平静 纪念日：腊月二十一 任务清单 昨日完成...
日更挑战第一百二十一天 天气：晴 心情：一般 纪念日：无 任务清单 昨日完成的任务，最重要的三件事：简书日更 太极...
今天是什么日子 起床：6：00 就寝：22：00 天气：晴 心情：坚决 纪念日：正月二十一 和平分手 任务清单 昨...
问答部分 一、\d，\w,\s,[a-zA-Z0-9],\b,.,*,+,?,x{3},^$分别是什么? \d~表...
凌天来到任务楼，在任务楼寻找着筑基期的任务。 任务楼每天都有很多的修者汇聚，有来兑换任务的，也有的是来领...
本文标题：任务二十一
本文链接：https://www.haomeiwen.com/subject/kbfwnttx.html
网友评论