资讯专栏INFORMATION COLUMN

常用布局

RyanQ / 579人阅读

摘要:转载上下布局,上方高度固定,下方高度自动填满原地址链接转载实现两个并排等高原地址链接居中会限定宽度不限定宽度不定宽内图片居中学生活动页

转载:html上下布局,上方高度固定,下方高度自动填满

原地址链接

转载:css实现两个div并排等高

原地址链接

居中
// 会限定宽度
.mertailImgActive {
        width: auto;
        height: auto;
        max-height: 100%;
        max-width: 100%;
        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translateX(-50%) translateY(-50%);
        -moz-transform: translateX(-50%) translateY(-50%);
        transform: translateX(-50%) translateY(-50%);
    }
    
// 不限定宽度
    .boardItemCon {
        margin: auto;
        text-align: center;
        font-size: 3rem;
        color: white;
        max-height: 100%;
        max-width: 100%;
        position: absolute;
        left: 0;
        right: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        transform: translateY(-50%);
    }
不定宽div内图片居中

学生活动页

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

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

相关文章

  • CSS常用布局

    摘要:头部主要内容左边栏右边栏尾部显示为头部主要内容左边栏右边栏尾部圣杯布局和双飞翼布局的原理这篇文章讲解得比较清楚,我就不再赘述。 ====== 样例代码不能显示,请看原文https://magicly.me/css-layout/ ====== 布局是CSS中一个很重要的部分,甚至我觉得是最重要也是最难的部分,其他诸如字体大小、颜色等等都是很容易的。最近总结一下使用过的CSS常...

    aaron 评论0 收藏0
  • Andriod 四大布局 使用详解

    摘要:中常用的四大布局。已经弃用,此问略过。线性布局,常用布局之一,主要有水平布局垂直布局两种。继承关系继承,关系如下简单例子如下上述布局实现代码如下微信公众号程序员至此,本篇已结束,如有不对的地方,欢迎您的建议与指正。 showImg(https://segmentfault.com/img/remote/1460000019975019?w=157&h=54); 极力推荐文章:欢迎收藏A...

    Batkid 评论0 收藏0
  • 微信小程序开发必备必看常用的Flex布局模式-wxflex

    摘要:首发地址微信小程序的布局种必备常用的布局模式代码库地址官方建议的布局的布局相比传统的布局来说,简单快捷方便。 首发地址:http://weappdev.com/t/flex-wx... wxflex 微信小程序的Flex布局demo-4种必备常用的Flex布局模式 代码库 github地址:https://github.com/icindy/wxflex 官方建议的Flex布局 Fle...

    jzzlee 评论0 收藏0
  • 深入学习CSS布局系列(一)布局常用属性

    摘要:布局涉及到的属性常用属性值此元素不会被显示它和属性不一样。当所有父元素中的所有元素脱离文档流之后,父元素将失去原有默认的内容高度浮动塌陷配合使用属性规定元素的哪一侧不允许其他浮动元素。 @(CSS技巧)[CSS, 布局] 深入学习CSS布局系列(一)布局常用属性 一直感觉自己对CSS的各个属性很了解,可是在前几天一次面试后发现自己真的很多地方感觉自己知道,可是实际上自己并不是真的理解了...

    Noodles 评论0 收藏0
  • 阿里团队常用布局——双飞翼布局

    摘要:双飞翼布局新手来说不太好理解,光靠死记不行,理解了以后就能轻易写出来。献上代码双飞翼双飞翼布局的好处是淘宝团队提出一种优化写法,写在前面,优先加载,优先渲染,而且兼容性好。双飞翼布局新手来说不太好理解,光靠死记不行,理解了以后就能轻易写出来。献上代码: 双飞翼 .wrap { width: 90%; ...

    GeekGhc 评论0 收藏0
  • CSS 常用的定位和布局方法汇总(已添加源码地址)

    CSS-Layout 旨在打造详尽的前端布局代码学习库(自从用了框架开发,CSS生疏了不少,所以开这个库练练手)SF不能正确解析含有中文的网址,所以某些预览链接无法跳转,请访问我的博客阅读此文 常见定位方法 水平居中 子元素为行内元素还是块状元素,宽度一定还是宽度未定,采取的布局方案不同。 方案选择基本思路:子元素为 行内元素:对父元素设置text-align:center; 定宽块状元素: 设...

    loonggg 评论0 收藏0

发表评论

0条评论

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