粗體文本沒有在iPhone上顯示，但在Android上顯示正常

所以我試圖讓我的菜單欄中的所有項目加粗。我有幾個鏈接都可以正常工作，但其中一條鏈接沒有問題。在我的CSS中有一個：懸停選擇器，當鼠標懸停在每個項目上時，可以更改按鈕背景的顏色。有一個不同，因爲它是一個下拉菜單，當你將鼠標懸停在它上面時會彈出。很顯然，它有一個：懸停選擇器，當鼠標懸停在上面時顯示菜單，同時更改背景顏色。當我在計算機上的瀏覽器中查看代碼時，結果很好。與在Android設備上查看一樣。但是，無論出於何種原因，當我將其拉到iPhone上時，下拉項目不會粗體顯示。我甚至嘗試過iPhone上的多個瀏覽器無濟於事。粗體文本沒有在iPhone上顯示，但在Android上顯示正常

這裏是我的HTML：

<div id="menu"> 
    <ul> 
    <li id="dropdown"><a href="#">Dropdown</a> 
     <ul> 
     <li><a href="#">Item 1</a></li> 
     <li><a href="#">Item 2</a></li> 
     </ul></li> 
    <li><a href="#">Normal</a></li> 
    <li><a href="#">Normal</a></li> 
    </ul> 
</div>

這裏是我的CSS：

#menu { 
    margin: 0px; 
    padding: 10px 0px 10px 0px; 
    background-color: #A4C3FF; 
    width: 100%; 
    text-align: center; 
} 

#menu ul { 
    list-style: none; 
    margin: auto; 
    padding: 0; 
} 

#menu ul li { 
    display: inline; 
    padding: 5px 30px 5px 30px; 
    font-size: 28px; 
    color: white; 
    font-weight: bold; 
} 

#menu ul li:hover { 
    background:#325CBE; 
} 

#menu a:link, #menu a:visited { 
    color:white; 
    text-decoration:none; 
    font-weight: bold; 
} 

#dropdown a { 
    line-height: 40px; 
} 

#dropdown { 
    position:relative; 
} 

#dropdown ul { 
    display:none; 
    position:absolute; 
    top: 90%; 
    left: 0px; 
    background:#A4C3FF; 
    padding: 10px 0; 
} 

#dropdown:hover > ul { 
    display:block; 
}

如此，因爲它適用於除了iPhone一切都很好，我會猜測，這是一個問題iPhone不支持：懸停選擇器或其他東西（因爲只有下拉菜單不顯示粗體）。如果有人可以向我解釋爲什麼它不起作用以及如何解決它，我將非常感激！

來源

2016-06-16 zzzz02

移動設備沒有：懸停狀態，因爲沒有持久指針。換句話說，由於沒有鼠標光標可以激活懸停狀態，移動設備通常會激活：1次旋轉時的懸停樣式和2次旋轉中的實際鏈接。有些Android設備會忽略：懸停狀態並關注鏈接。

如果您澄清了您的問題，我們可能會給出更好的答案。

編輯：我把你的代碼放到了JSFiddle中。
它似乎在iPhone上正常工作 - http://jsfiddle.net/6vn91t8d/

<div id="menu"> 
<ul> 
<li id="dropdown"><a href="#">Dropdown</a> 
    <ul> 
    <li><a href="#">Item 1</a></li> 
    <li><a href="#">Item 2</a></li> 
    </ul></li> 
<li><a href="#">Normal</a></li> 
<li><a href="#">Normal</a></li>

來源

2016-06-16 22:36:15 Derek

我最終什麼事做的是使兩個獨立的菜單 - 一個用於手機和一個桌面。移動版沒有下拉功能，並且在iPhone上顯示得很好。謝謝你的幫助。 – zzzz02

您可以使用< .select>和< .option>標籤作爲下拉菜單。但是，如果設備遭到越獄，人們還報告了這個錯誤。您是否嘗試過< .b>標記而不是字體重量？如果它在其他設備上工作，那麼這意味着它可能是iPhone的問題（應該在標籤內部忽略全屏）

來源

2016-06-16 22:29:49 TransmissionZ

粗體文本沒有在iPhone上顯示，但在Android上顯示正常

回答

相關問題