一、實現方法 小技巧，最外層元素高度100%，flex布局，flex-direction為cloumn， overflow為hidden； 里面子元素需要自適應寬高的元素給一個最小高度min-height； 另一個需要撐滿的元素flex設置為1。 二、寫法如下： ...

...

目前測試支持的瀏覽器： 兼容IE10及以上、Chrom、Firefox瀏覽器。 假如考慮IE10以下瀏覽器，可以考慮其他寫法。 話不多說，上代碼： <div style="background: green; display: flex;"> ...

前言 　　純css3實現的輪播圖效果，和JavaScript控制的相比，簡單高效了很多，但是功能也更加單一，只有輪播不能手動切換。 　　用什么實現的呢？頁面布局 + animation動畫 HTML部分 View Code 　　html部分 ...

;style type="text/css"> *{ margin: 0; padding: ...

這是我上一次的面試題、一晃兩個月過去了。 從前都是拿原理騙人，把怎么實現的思路說出來。 我今天又被人問到了，才想起來真正碼出來。碼出來效果說明一切： 以上gif，只用到了5張圖片，一個html+css，沒有任何js。然后實現了自動輪播效果。 具體代碼如下：結構布局 ...

（1）使用float -------------------------------------------------------------------------- ...

從事前端工作近五年了，說來慚愧，對css一直很頭疼，今天又碰到了一個讓元素自動撐滿高度的問題，以此來適應不同的屏幕尺寸，查閱了一些資料，發現解決方法竟然如此簡單，我也來簡單地記錄一下吧。 需求描述：頁面有一個公共的頭部，下面是正文的div，為了適應不同尺寸的屏幕，要求讓這個div自動撐滿高度 ...