今遇到難題:子元素的長寬比為1:1,當父元素高度大於寬度時,子元素鋪滿父元素的寬度,當父元素高度小於寬度時,子元素鋪滿父元素的高度。如何只用css實現?
印象中我能用傳統方法解決,但是好像那個方法只能横向鋪開。
最終由gemini fast解決了這個問題,用到
享受思維樂趣
今遇到難題:子元素的長寬比為1:1,當父元素高度大於寬度時,子元素鋪滿父元素的寬度,當父元素高度小於寬度時,子元素鋪滿父元素的高度。如何只用css實現?
印象中我能用傳統方法解決,但是好像那個方法只能横向鋪開。
最終由gemini fast解決了這個問題,用到
我一開始喜歡用一張空白圖片實現固定寬高比,但是padding-top + calc應該會更簡單:
css中,table有一個屬性,table-layout。它的默認值為auto,即自動根據內容調整表格大小。
但是實際應用中,經常發現有些格子中的內容因為換行而不夠美觀,這時我們還是要手動調整寬度。
則將table-layout設為fixed,之後寫定它的總寬及第一個tr中每一項的寬度,即可實現手動調整table寬度。
本文介紹兩個css功能:計算函數及定制屬性。
不要將它錯看成scal(),為了方便記憶,可稱之為「卡殼」。
如果你希望某元素高度比100%少24px,以便在它上方放置一個高24px的元素,那麼你就有必要使用它:
transform可使元素位移及變形。如果配合
來自這裏。
/* @keyframes duration | easing-function | delay |
iteration-count | direction | fill-mode | play-state | name */
animation: 3s ease-in 1s 2 reverse both paused slidein;
/* @keyframes duration | easing-function | delay | name */
animation: 3s linear 1s slidein;
/* two animations */
animation: 3s linear slidein, 3s ease-out 5s slideout;
一般我們使用的是第二個,還要配合@keyframes,如:

今測到尹倉在線有個中文標點換行不對的bug,網上一查,得知css有一個專門針對中文標點換行的屬性line-break。
如果不是做div與textarea重合,一般情況幾乎用不到這個屬性,因為一般都希望中文標點不要置前。
加了這個屬性之後,上下幾乎重合: