资讯专栏INFORMATION COLUMN

浮动定位之三列布局问题与发现(下)

Cruise_Chan / 982人阅读

摘要:代码如下,分别左浮动和右浮动,是块级元素。注意,浮动元素脱离了文档流,块级元素独占一行。将放置在之后的后果就是所在的那一行已经被独占了,只能顺流到下一行,并在下一行往右浮动。

HTML代码如下:

nav,aside分别左浮动和右浮动,main是块级元素。
注意,浮动元素脱离了文档流,块级元素独占一行。
将aside放置在main之后的后果就是main所在的那一行已经被main独占了,aside只能顺流到下一行,并在下一行往右浮动。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/116121.html

相关文章

  • 浮动定位三列布局问题发现(上)

    摘要:理想的三列布局效果应该是这样的但是现实中的情况是侧边栏跑到下一列的右边去了。源代码如下源代码如下错误发生在中的安放位置,我们将安置在之后,正确的做法是将放置在之前。为什么调换了位置就好了呢背后的原理是什么呢参考浮动定位之三列布局下 理想的三列布局效果应该是这样的showImg(https://segmentfault.com/img/bVbvqo5?w=1893&h=896); 但是现...

    oujie 评论0 收藏0
  • 构建静态页面 之 [ 布局 ]

    摘要:布局描述表示对页面中的显示效果进行一些排列水平方向居中垂直方向居中居中布局水平方向居中第一种方式水平居中行内块级元素水平居中的第一种方法该方法需作用在父子结构中为父级设置属性为子级设置属性注意的问题属性是设置文本内容对齐方式的 布局 描述 表示对页面中的显示效果进行一些排列 水平方向居中 垂直方向居中 居中布局 水平方向居中 第一种方式 水平居中 + 行内块级元素(text-a...

    andot 评论0 收藏0
  • 构建静态页面 之 [ 布局 ]

    摘要:布局描述表示对页面中的显示效果进行一些排列水平方向居中垂直方向居中居中布局水平方向居中第一种方式水平居中行内块级元素水平居中的第一种方法该方法需作用在父子结构中为父级设置属性为子级设置属性注意的问题属性是设置文本内容对齐方式的 布局 描述 表示对页面中的显示效果进行一些排列 水平方向居中 垂直方向居中 居中布局 水平方向居中 第一种方式 水平居中 + 行内块级元素(text-a...

    JessYanCoding 评论0 收藏0
  • [译]HTML&CSS Lesson5: 定位

    摘要:浮动定位的其中一种方法就是使用属性。例如,是一个内联元素,它默认的值为和值是不生效的。然而,如果我们将这个内联元素设置为浮动,那么它的默认值会变成这时候和值就生效了。包裹元素就是将浮动元素置于父元素中,父元素作为容器会置于正常的文件流中。 CSS最大的用处之一就是可以将内容和元素定位到任何我们想要的位置,使我们的设计具有结构,使内容更加易懂。 CSS有好几种不同的定位属性,每种都有自己...

    YorkChen 评论0 收藏0
  • [译]HTML&CSS Lesson5: 定位

    摘要:浮动定位的其中一种方法就是使用属性。例如,是一个内联元素,它默认的值为和值是不生效的。然而,如果我们将这个内联元素设置为浮动,那么它的默认值会变成这时候和值就生效了。包裹元素就是将浮动元素置于父元素中,父元素作为容器会置于正常的文件流中。 CSS最大的用处之一就是可以将内容和元素定位到任何我们想要的位置,使我们的设计具有结构,使内容更加易懂。 CSS有好几种不同的定位属性,每种都有自己...

    _Dreams 评论0 收藏0

发表评论

0条评论

Cruise_Chan

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<