根据用户的分辨率修改按钮大小

Question

如何使按钮在不同的屏幕分辨率下保持其大小？我尝试过使用＆＃39;％＆＃39;但它到目前为止只与div合作。

.button{
        width:x;
        height:y;
       }

x和y应该具有哪些值，以便按钮根据屏幕分辨率进行修改？

Answer 1

添加视图端口大小vw或vh会将按钮设置为浏览器大小。 因此，如果浏览器是全屏的，那么对于那里的分辨率

是不合适的

＆＃13;

＆＃13;

button {
  width: 10vw;
  height: 10vh;
}
body {
  height: 100vh;
}

＆＃13;

<button>Create</button>

＆＃13;

＆＃13;

＆＃13;

Answer 2

尝试使用Padding，并将其置于内联

.button
{

display:inline-block;
padding: 2%;

}

如果你想增加高度，可以使用像这样的行高属性

.button
{

line-height: 1.5rem;
display:inline-block;
padding: 2%;

}