美文网首页
HTML+CSS 如何居中一个浮动元素

HTML+CSS 如何居中一个浮动元素

作者: Joe_Somebody | 来源:发表于2017-05-14 09:48 被阅读0次

父元素和子元素同时左浮动,然后父元素相对左移动50%,再然后子元素相对右移动50%,或者子元素相对左移动-50%也就可以了。

<style type="text/css">
    .p{

        position:relative;

        left:50%;

        float:left;

    }
    .c{

        position:relative;

        float:left;

        right:50%;

    }
</style>


<div class="p">

    <h1 class="c">Test Float Element Center</h1>

</div>

相关文章

  • HTML+CSS 如何居中一个浮动元素

    父元素和子元素同时左浮动,然后父元素相对左移动50%,再然后子元素相对右移动50%,或者子元素相对左移动-50%也...

  • web前端面试之CSS布局(码动未来)

    web前端面试之CSS布局(码动未来) 2.2.1、如何居中div?如何居中一个浮动元素?如何让绝对定位的div居...

  • 浮动元素居中法

    1.现代浏览器浮动元素居中 2.兼容ie6的浮动元素居中法

  • 浮动元素居中

    怎么才能使浮动元素居中呢? 浮动可以left,right 就是没有中间啊。那怎么办呢?可以设置一个中间的基线。也就...

  • 居中大法

    水平居中 行内元素水平居中给它的父级元素设置 块级元素水平居中给该元素设置margin值 子元素有浮动对父元素进行...

  • 浮动元素水平居中

    我是浮动的 我也是居中的 .box{ float:left; position:relativ...

  • 浮动元素垂直居中

    1.利用line-height(只适用于float) (注意:父元素不能设置高度和padding-top padd...

  • 居中‘魔法’总结

    作为一个前端程序员,各种居中的需求会经常遇到,比如说文本居中,水平居中,垂直居中,浮动元素居中等等。掌握一些居中的...

  • day04

    今天我学到了什么 1.盒子模型 2、浮动float 3、如何清除浮动 4定位 5、实现元素的垂直水平居中 6、CS...

  • 垂直居中的这点事

    标签(空格分隔): css 垂直居中浮动元素 垂直居中元素,在布局中经常使用,总结一下: 方法一:已知元素的高宽 ...

网友评论

      本文标题:HTML+CSS 如何居中一个浮动元素

      本文链接:https://www.haomeiwen.com/subject/stafxxtx.html