css元素垂直居中的四个方法(包括未知元素的高度的解决方法)

height: 200px;

background-color: #6699ff;

position: absolute;

/父元素需要相对定位/

top: 50%;

left: 50%;

margin-top: -100px;

/设为高度的1/2/

margin-left: -100px;

/设为宽度的1/2/

}

方法二:绝对定位居中(改进版之一未知元素的高宽)


.content {

width: 200px;

height: 200px;

background-color: #6699ff;

position: absolute;

/父元素需要相对定位/

top: 50%;

left: 50%;

transform: translate(-50%, -50%);

/在水平和垂直方向上各偏移-50%/

}

方法三:绝对定位居中(改进版之二未知元素的高宽)


.content {

width: 200px;

height: 200px;

background-color: #6699ff;

margin: auto;

/很关键的一步/

position: absolute;

/父元素需要相对定位/

left: 0;

top: 0;

最后

javascript是前端必要掌握的真正算得上是编程语言的语言,学会灵活运用javascript,将对以后学习工作有非常大的帮助。掌握它最重要的首先是学习好基础知识,而后通过不断的实战来提升我们的编程技巧和逻辑思维。这一块学习是持续的,直到我们真正掌握它并且能够灵活运用它。如果最开始学习一两遍之后,发现暂时没有提升的空间,我们可以暂时放一放。继续下面的学习,javascript贯穿我们前端工作中,在之后的学习实现里也会遇到和锻炼到。真正学习起来并不难理解,关键是灵活运用。

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

css源码pdf

JavaScript知识点
/618166371)**

[外链图片转存中…(img-SBRah5Sb-1714259230459)]

[外链图片转存中…(img-eB0KgJ64-1714259230461)]

  • 4
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值