CSS calc()函数与单位vh 常见height:100vh[通俗易懂]

CSS calc()函数与单位vh 常见height:100vh[通俗易懂]calc()函数属于CSS3版本内容,用于动态计算长度值。例如:width:calc(100%-10px);需要注意的是,运算符前后都需要保留一个空格。calc()函数支持”+”,”-“,”*”,”/”运算;举例,给一个div动态设置宽度如下:#divBox{position:absolute;left:50px;width:calc(100%-100p…

大家好,又见面了,我是你们的朋友全栈君。

calc() 函数属于CSS3版本内容,用于动态计算长度值。例如:width: calc(100% - 10px);需要注意的是,运算符前后都需要保留一个空格。calc()函数支持 “+”, “-“, “*”, “/” 运算;

举例,给一个div动态设置宽度如下:

#divBox { position: absolute; left: 50px; width: calc(100% – 100px); border: 1px solid black; background-color: yellow; padding: 5px; text-align: center; }

 

vh,是指css中相对长度单位,表示相对视口高度(Viewport Height),1vh = 1% * 视口高度。

视口比例长度定义了相对于视口的长度大小,这是文档的可见部分。

通俗点讲,vh就是当前屏幕可见高度的1%,也就是说  height:100vh == height:100%;

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/135418.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • ubuntu18.04更新内核_如何查看linux系统内核版本

    ubuntu18.04更新内核_如何查看linux系统内核版本1.查看内核版本2.修改apt源编辑在尾部增加一行/etc/apt/sources.listdebhttp://security.ubuntu.com/ubuntutrusty-securitymain更新apt-getupdate3.查看可更新的内核apt-cachesearchlinux-imageapt-cachesearchlinux|greplinux-headers本次我们更新4.15aptinst…

    2022年8月23日
    3
  • 第46章 执行数据库恢复

    第46章 执行数据库恢复

    2021年6月10日
    95
  • java jasypt_java – 使用jasypt加密解密「建议收藏」

    java jasypt_java – 使用jasypt加密解密「建议收藏」如何使用jasypt解密加密的密码.packagecom.uk.mysqlmaven.jsf.test;importorg.jasypt.util.password.StrongPasswordEncryptor;importorg.jasypt.util.text.StrongTextEncryptor;publicclassPasswordEncryptionDecryptionUs…

    2022年9月26日
    0
  • java jasypt_jasypt命令行工具的使用说明

    java jasypt_jasypt命令行工具的使用说明jasypt能够以很简单的方式为Java项目提供加密功能,这种简单的方式体现着它的命令行工具,与Spring,Hibernate,Springsecurity,wicket等第三方框架的集成。本文参加jasypt官方网站:http://www.jasypt.org/下载jasypt包,解压缩到本地目录。如下图:根目录:命令行工具目录:说明:在lib目录下是jasypt的核心jar和与第三方组件…

    2022年9月26日
    0
  • linux 服务器端配置nfs(配置samba服务器步骤)

    一、NFS服务简介  NFS是NetworkFileSystem的缩写,即网络文件系统。一种使用于分散式文件系统的协定,由Sun公司开发,于1984年向外公布。功能是通过网络让不同的机器、不同的操作系统能够彼此分享个别的数据,让应用程序在客户端通过网络访问位于服务器磁盘中的数据,是在类Unix系统间实现磁盘文件共享的一种方法。  NFS的基本原则是“容许不同的客户端及服务端

    2022年4月13日
    130
  • leetcode-172. 阶乘后的零[通俗易懂]

    leetcode-172. 阶乘后的零[通俗易懂]给定一个整数 n,返回 n! 结果尾数中零的数量。示例 1:输入: 3输出: 0解释: 3! = 6, 尾数中没有零。示例 2:输入: 5输出: 1解释: 5! = 120, 尾数中有 1 个零.说明: 你算法的时间复杂度应为 O(log n) 。class Solution {public: int trailingZeroes(int n) { int ans = 0; for(int i = 5;i <= n;i += 5){

    2022年8月9日
    3

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号