zoukankan      html  css  js  c++  java
  • input和button不同高 和 rem

    • rem的使用

    浏览器中默认的字体大小是 16px,此时为 100%。当我们在使用 rem 的时候,常常给 html设置为 html{font-size:62.5;},这样的好处是 1rem 刚好为 10px。
    同时我们常常写两个 font-size,一个用来兼容不支持 rem 属性的浏览器,在我们使用calc的时候也常常设置两个保证代码的兼容性.

    • 为什么input(text)和button的高度相同却没有对齐

    因为 input 的高度算法和button不同,可以说input是非常另类的 (而且在不同浏览器中也是另类的

    		.searchBar input{
    			height: 25px;
    			box-sizing: border-box;
    			border: 0;
    			vertical-align: middle;
    		}
    		.searchBar button{
    			 50px;
    			height: 25px;
    			border: 0;
    			vertical-align: middle;
    		}
    

    如上设置即可,如果不加 vertical-align: middle; 在不同的浏览器(每个浏览器表现不同,比如chrome中情况是button在位置上比input高)中可能还是会不对其,所以加上了。

  • 相关阅读:
    展示
    发布说明
    团队作业Week14
    Scrum Meeting NO.10
    Scrum Meeting NO.9
    Scrum Meeting NO.8
    Scrum Meeting NO.7
    Scrum Meeting NO.6
    ES6/ES2015核心内容
    用React & Webpack构建前端新闻网页
  • 原文地址:https://www.cnblogs.com/can-i-do/p/7510016.html
Copyright © 2011-2022 走看看