Question

当我更改div（id =“home”）中的文本大小时，它也会更改div的大小。我希望能够在不改变每次div大小的情况下更改文本大小。

这是HTML：

<!DOCTYPE html>
<html>
    <head>
        <link href='http://fonts.googleapis.com/css?family=Josefin+Sans' rel='stylesheet' type='text/css'>
        <link type="html/css" rel="stylesheet" href="websiteCSS.css"/>
        <title>PROTOTYPE</title>
    </head>
    <body>
        <div id="sidebar"></div>
        <div id="home" class="header">Home</div>
    </body>
</html>

和CSS：

body{
    margin: 0; 
    background: #d5e9d7;
}

#sidebar {
    z-index: 1;
    position: fixed;
    width: 20%;
    height: 100%;
    margin-top: 0;
    margin-left: 0;
    #background-color: light blue;
    background-image: linear-gradient(to bottom, #545454 0%, #424242 100%);
    margin-bottom: 10px;
}

.header {
    position: fixed;
    width: 2.5em;
    height: 1em;
    padding: 8px;
    background-color: #b2b2b2;
    margin-top: 0.5%;
    margin-left: 20.5%;
    font-family: 'Josefin Sans', sans-serif;
    font-size: 2em;
    color: #333333;
}

.header:hover {
    font-size: 2.1em;
}

Answer 1

您可以在px中设置div大小，也可以设置min-width或min-height属性。

Answer 2

设置容器div（宽度和高度）以保持最坏情况（最大）字体大小。这将根据字体大小停止div的大小调整。

如何在不改变div大小的情况下更改HTML / css中的字体大小？

2 个答案: