不經常使用可是很實用的css記錄

        本文主旨是記錄一些不經常使用可是很是炫酷的css屬性,提高用戶體驗的捷徑之一。php

一、background-attachment  滾動視差    https://codepen.io/Chokcoco/pen/oMPrGZcss

二、點擊圖片產生水紋效果                      https://codepen.io/Chokcoco/pen/wxYZWOcss3

三、transform 屬性向元素應用 2D 或 3D 轉換。該屬性容許咱們對元素進行旋轉、縮放、移動或傾斜        http://www.w3school.com.cn/cssref/pr_transform.aspwordpress

四、width:fill-available,width:max-content,width:min-content,width:fit-content      https://www.zhangxinxu.com/wordpress/2016/05/css3-width-max-contnet-min-content-fit-content/spa

五、計算屬性 calc()       http://www.runoob.com/try/try.php?filename=trycss_func_calcssr

六、object-fit   調整替換元素在外部容器變化的時候所呈現的樣子     https://www.zhangxinxu.com/wordpress/2015/03/css3-object-position-object-fit/code

七、只有內聯設置的width與height才能被 obj.style.width|height獲取到orm

八、凡是須要滾動的地方都加一句scroll-behavior:smooth  ,scrollIntoView能夠讓元素進入視區blog

target.scrollIntoView({
    behavior: "smooth"
});
相關文章
相關標籤/搜索