在不改變按鈕大小的情況下增加HTML按鈕字體大小

我一直無法弄清楚這一點，因此我正在向社區尋求幫助。提前致謝。我遇到的問題是，當我更改我的按鈕中字體的大小時，該按鈕會調整大小。截至目前，我想保持按鈕在一個特定的大小。所以，我已將我的按鈕固定到特定的大小，但現在我無法更改字體大小。我目前正在Chrome上運行我的程序。在不改變按鈕大小的情況下增加HTML按鈕字體大小

下面是HTML塊：

<div class="file-input-wrapper"> 
    <button class="btn-file-input">Upload Documents</button> 
    <input type="file" name="filesToUpload[]" id="filesToUpload" multiple="" onChange="makeFileList();" /> 
</div> 
<p> 
    <strong>Files You Selected:</strong> 
    <ul id="fileList"> 
    <li>No Files Selected</li> 
    </ul> 
    <div class="file-input-wrapper1"> 
    <button class="btn-file-input1">Upload Documents</button> 
    <input type="submit" value="Upload!" /> 
    </div> 
</p> 

<style type="text/css"> 
    .file-input-wrapper { 
    width: 400px; 
    height: 125px; 
    overflow: hidden; 
    position: relative; 
    } 

    .file-input-wrapper>input[type="file"] { 
    font-size: 200px; 
    position: absolute; 
    top: 0; 
    right: 0; 
    opacity: 0; 
    } 

    .file-input-wrapper>.btn-file-input { 
    display: inline-block; 
    width: 400px; 
    height: 125px; 
    } 

    .file-input-wrapper:hover>.btn-file-input { 
    background-color: #aaa; 
    } 

    .file-input-wrapper1 { 
    width: 400px; 
    height: 125px; 
    overflow: hidden; 
    position: relative; 
    } 

    .file-input-wrapper1>input[type="submit"] { 
    font-size: 200px; 
    position: absolute; 
    top: 0; 
    right: 0; 
    opacity: 0; 
    } 

    .file-input-wrapper1>.btn-file-input1 { 
    display: inline-block; 
    width: 400px; 
    height: 125px; 
    } 

    .file-input-wrapper1:hover>.btn-file-input1 { 
    background-color: #ffff00; 
    } 
</style>

來源

2016-11-14 INOH

您可以設置按鈕字體大小如下：

button { 
    font-size: 40px; 
}

由於您的按鈕有一個定義的高度和寬度，它不應該改變自己尺寸。

來源

2016-11-14 19:25:41

由於該訣竅 – INOH

爲所有按鈕添加一個額外的類。即使你有一些實際上不是按鈕的「按鈕」，而是輸入類型=「提交」或輸入類型=「按鈕」，將這個類添加到所有這些東西。那麼做到這一點在你的CSS：

.some_class_added_to_all_buttons{ 
    width: some-width; 
    height: some-height; 
    font-size: some-font-size; 

}

，如果你有一個已經有類的按鈕，添加一個額外的一個這樣的

<button class="btn-file-input1 additional_class">Upload Documents</button>

來源

2016-11-14 19:30:14 borbesaur

在不改變按鈕大小的情況下增加HTML按鈕字體大小

回答

相關問題