Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

CSS 实现高度是宽度的一半 #7

Open
ryancui92 opened this issue Aug 17, 2017 · 0 comments
Open

CSS 实现高度是宽度的一半 #7

ryancui92 opened this issue Aug 17, 2017 · 0 comments

Comments

@ryancui92
Copy link
Owner

ryancui92 commented Aug 17, 2017 •
edited
Loading

padding 属性 MDN 和 规范：

Percentages - refer to the width of the containing block

当使用百分比值时，通过包含块的宽度计算。由此可以通过设置 padding-top: 50%; 来实现高度恒为宽度的 50% 效果。

注意的是，这种实现方式其实是把 padding 撑开，实际上 box 并没有高度。因此当需要在 box 内部再进行布局时，需要放到外面。

CodePen
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@ryancui92