摘要：学习一个月了，对和页面的静态布局进行一次总结总体来说静态页面布局分为两大类，水平布局和垂直布局，只要水平布局和垂直布局都能熟悉了，那么对于静态的页面的布局就不会有太大的问题再说布局之前先说一下元素的显示模式分类。
学习HTML一个月了，对HTML和Css页面的静态布局进行一次总结
总体来说静态页面布局分为两大类，水平布局和垂直布局，只要水平布局和垂直布局都能熟悉了，
那么对于静态的页面的布局就不会有太大的问题
再说布局之前先说一下元素的显示模式分类。
元素的显示模式分类可以分为块级元素，行内元素，行内块级元素。
块级元素是垂直排列的，每个元素会独占一行，行内元素和行内块级元素不会独占一行，会水平排列。
当然元素的显示模式是可以随便转换的。
下面先来说说垂直布局，
垂直布局让元素在页面里面垂直排列，这个是比较简单的，我们知道在正常情况下页面里的
块级元素都是从上到下依次排列的，那么这个垂直布局就相对来说简单点。只要把块级元素依次写在页面中，
那么浏览器会默认的让这些块级元素垂直排列，如果有行内块级元素或行内元素
则可以转化为块级元素来实现元素的垂直排列。
然后是来说水平布局，
水平布局就是让元素在页面里面水平排列，这个比较垂直排列会相对复杂一些，因为水平排列会涉及到浮动，
因此会出现很多问题，比如高度塌陷，覆盖等。而且一般都是通过浮动来实现水平布局，所以会遇到很多问题，
这就要求我们对浮动有一定的了解，下面我会写一些布局的细节以及浮动的各种情况。
首先最常用的就是居中显示，各种居中方式中我们最常用的就是text-align：center ，
text-align：center可以让下面几种情况居中：
可以让该元素的文本内容水平居中，该元素中的行内元素和行内块级元素，
但是不能让元素内部的块级元素水平居中
垂直居中，用的最多的是让line-height=元素的height，还有vertical-align，
也是垂直对齐，他一般是让图片右边的文本对齐图片的上中下。
然后用的多的就是内外边距了，就是margin和padding，很好的理解和运用内外边距能够
让你很方便的实现开头或结尾的一些距离等。
然后就是定位了，页面布局的定位最常用的就是浮动（float）和定位（position），
感兴趣的可以去我的日记了有详细的介绍。
本人学习前段一个月，完全的菜鸟，希望大家多多指点。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/114369.html
摘要：学习一个月了，对和页面的静态布局进行一次总结总体来说静态页面布局分为两大类，水平布局和垂直布局，只要水平布局和垂直布局都能熟悉了，那么对于静态的页面的布局就不会有太大的问题再说布局之前先说一下元素的显示模式分类。 学习HTML一个月了，对HTML和Css页面的静态布局进行一次总结 总体来说静态页面布局分为两大类，水平布局和垂直布局，只要水平布局和垂直布局都能熟悉了， 那么对于静态的页面...
摘要：移动端布局总结移动端全兼容的移动端知识涵盖伪类等全移动端不得不讲的头标签移动端自适应方案移动端适配总结布局新旧混合写法详解兼容微信使用实现手淘页面的终端适配淘宝弹性布局方案实践理解所需的知识产生的小数像素问题高性能动画动画的性能优化处理和动 移动端rem布局总结 移动端全兼容的flexbox 移动端知识(涵盖、css、伪类等)【全】 移动端不得不讲的头标签 移动端自适应方案 移动端适...
阅读 2731·2021-11-22 13:54
阅读 3460·2021-11-16 11:44
阅读 1326·2021-09-07 10:19
阅读 1440·2019-08-29 17:30
阅读 3147·2019-08-29 11:33
阅读 3512·2019-08-26 12:18
阅读 2856·2019-08-26 11:53
阅读 1295·2019-08-26 10:47
