广州网站制作公司

6年深耕 专注响应式网站制作

  • 首页
  • 价格
  • 服务
  • 案例
  • 我们
  • 联系
首页 > 观点

height:100%和height:100vh的区别与运用

2021-12-07

vh: 相对于视窗的高度, 视窗被均分为100单位的vh;

也就是说,1vh就是当前屏幕可见高度的1%

height:100vh == height:100%;

但是当元素没有内容时候,设置height:100%,该元素不会被撑开,此时高度为0,

但是设置height:100vh,该元素会被撑开屏幕高度一致。

与calc结合使用效果更佳。

calc是 css3提供的一个在css文件中计算值的函数:

  • 用于动态计算长度值。
  • 需要注意的是,运算符前后都需要保留一个空格,例如:width: calc(100% - 10px);

如:calc (100vh - 10px)表示整个浏览器窗口高度减去10px的大小

calc()的兼容性如下,使用时需注意:

height:100%和height:100vh的区别与运用(图1)

Tag:

感谢您关注我们,如果您有建站需求,请与我们取得联系。

网站制作公众号

艾迪创想@网站设计机构 | 网页制作公司 | 网站制作公司

咨询直线:13711107165

最新

  • 关于eyoucms网站制作系统多语言版的常见问题
  • 域名转移到阿里云后,如何修改DNS
  • 易优网站制作系统1.58版本主要功能说明
  • height:100%和height:100vh的区别与运用
  • phpstudy2018版如何添加本地网站
  • 外贸网站制作为什么推荐用美国空间
  • 响应式网站设计广告传媒公司网站模板S1更新日志
  • 关于eyou和凡科建站的一些对比
  • 响应式素材资源下载模板D1更新日志
  • 新闻资讯模板M3更新日志

相关

图文

网站推广之事件营销

网站推广之事件营销

网站制作推广之病毒式营销

网站制作推广之病毒式营销

网站制作推广,让电子商务潮流不可阻挡

企业网站制作如何提高网站的公信力

给一些新手网站设计师的建议

给一些新手网站设计师的建议

个人网页制作需要掌握什么知识?

网站建设费用预算的四个要点

网站建设费用预算的四个要点

中小网站制作公司企业的出路思考

中小网站制作公司企业的出路思考

和客户关于网站制作推广的一些聊天记录整理

创优新能源网站推广实战-死链提交

创优新能源网站推广实战-死链提交

艾迪创想广州网站制作公司
观点
模板 文档 推广 手机 问题 方案

艾迪创想广州网站制作公司

13711107165 / 020-61038641

广州荔湾区芳村大道东200号1850创意园51栋213

sales@tbadc.com

网站地图
2015-2020 艾迪创想 All Rights Reserved.  粤ICP备18129529号-4
  • 在线客服

    1839827928

  • 手机

    13711107165

    电话

    020-61038641

模板
定制
关于
联系