随笔分类 -  我总是记不住呀

块元素行内元素水平垂直居中方式
摘要：水平居中： ①行内元素(或行内块元素)包含在块元素里时可将元素看作是父元素中的文本，父元素(块元素设置text-align:center;) ②1.块元素定宽时，设置margin: auto;即可实现水平居中 ②2.块元素定宽时，设置position定位实现水平居中 垂直居中： 对应① 设置heig 阅读全文
posted @ 2021-11-19 15:56 夏大爷 阅读(643) 评论(0) 推荐(0)
position定位
摘要：为什么需要定位？ 1.某个元素可以自由的在一个盒子内移动位置，并且压住其他盒子。 2.当我们滚动窗口的时候，盒子是固定屏幕某个位置的。 浮动可以让多个块级盒子一行没有缝隙排列显示，经常用于横向排列盒子。 定位则是可以让盒子自由的在某个盒子内移动位置或者固定屏幕中某个位置，并且可以压住其他盒子。 定位 阅读全文
posted @ 2021-11-18 19:07 夏大爷 阅读(85) 评论(0) 推荐(0)
清除浮动
摘要：清除浮动本质： 清除浮动本质是清除浮动元素脱离标准流造成的影响 如果父盒子本身有高度，则不需要清除浮动 清除浮动之后，父级就会根据子盒子自动检测高度。父级有了高度，就不会影响下面的标准流了。 清除浮动语法：选择器{clear: 属性值;} 属性值 描述 left 不允许左侧有浮动元素(清除左侧浮动的 阅读全文
posted @ 2021-11-17 19:32 夏大爷 阅读(17) 评论(0) 推荐(0)
浮动练习
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-11-15 20:00 夏大爷 阅读(30) 评论(0) 推荐(0)
浮动布局
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-11-15 19:48 夏大爷 阅读(16) 评论(0) 推荐(0)
嵌套块元素垂直外边距塌陷
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-11-15 19:20 夏大爷 阅读(82) 评论(0) 推荐(0)