CSS字體過渡不撓

工作改變字體大小是不是隻要家長有柔性顯示工作時，我使用CSS字體過渡不撓

.parent { 
    display: flex; 
    align-items: center; 
} 

p { 
    font-size: 10px; 
    -webkit-transition: all 0.3s ease; 
    -moz-transition: all 0.3s ease; 
    -o-transition: all 0.3s ease; 
    -ms-transition: all 0.3s ease; 
} 

p:hover { 
    font-size: 20px;

}

<div class="parent"> 
    <p>Hello</p> 
</div>

轉型。它在刪除flex屬性時起作用。有沒有解決這個問題？

來源

2017-03-13 Cyber Junkie

你使用什麼瀏覽器？這適用於我和Chrome以及Firefox：JSFiddle：https://jsfiddle.net/7xwbqjw4/ –

不相關，但是您的CSS規則中的前綴過渡屬性之後缺少'transition'的非前綴屬性。 '過渡：所有的0.3s緩解;'總是最佳做法是在CSS規則中的前綴屬性之後有非前綴CSS屬性。 –

我在Firefox，Safari和Chrome中嘗試了您的代碼，並且字體大小發生變化時，過渡效果工作正常。

如果它不適合你，你可以嘗試添加顯示：-webkit-flex;以及顯示：flex;在你的CSS代碼是這樣的：

display: -webkit-flex; 
display: flex;

來源

2017-03-13 16:47:51

CSS字體過渡不撓

回答

相關問題