css3

2熱度

4回答

我有兩個盒子。當點擊一個按鈕時，左邊的框應該變小，右邊的框變大。我的目標是順利過渡。當正確的框變大時，我想要包括一個保證金權利。我使用CSS3過渡效果。我怎樣才能達到這一點，正確的框寬度和邊距正確的過渡發生同時和正確？ JS小提琴： http://jsfiddle.net/bmzw80py/4/ 我的代碼： HTML： <div class="container"> <div clas

1熱度

2回答

CSS 3的柱網將等於利潤率

.num_pad_wrap { width:300px; background:#eee; height:300px; } .num_pad_wrap div { float: left; width: 30%; background: #666C77; height: 50px;

1熱度

1回答

使用CSS關鍵幀交叉淡入淡出圖像

我在第一次使用CSS中的關鍵幀。它沒有在我測試了2個瀏覽器（Safari和Chrome）工作，我瞭解到，所有關鍵幀相關的屬性需要瀏覽器的前綴，所以我加了-webkit-但它仍然是行不通的目的是讓圖像每10秒交叉淡入淡出，但我只能不斷看到Image2。下面是股利代碼： <div id="cf"> <img class="bottom" src="Image1.jpg" width = "30

3熱度

2回答

如何使鼠標懸停平穩rotate3d？

如何進行平滑過渡當鼠標進入或離開盒子區域時，我會得到一個代碼，但是當我的鼠標從盒子區域出來並從另一側進入盒子時，元素轉換不平滑。代碼：fiddle $(document).ready(function() { var $one = $('#div1'), $two = $('#div2'), browserPrefix = "", usrAg = navigato

0熱度

2回答

CSS3 - 砌體佈局像pinterest - 列/框正在拆分

我有大約6個divs包含文本和圖像。它們的長度各不相同，但寬度相同。因此，我想展示像我已經實現的Pinterest。但是，div分成多列。我如何阻止這種情況發生？我用過的CSS在圖片下面。 .masonry { margin: 1.5em 0; -moz-column-gap: 1.5em; -webkit-column-gap: 1.5em; colum

3熱度

2回答

FF和IE中的CSS錯誤？包括邊界在內的過渡在兩者中產生意想不到的結果或者我會如何調整行爲？

我試圖創建一個CSS過渡，在Chrome中給出了期望的結果，但IE（10和11）和Firefox（41）不同（每個給出了不同的結果，但它們都未能顯示邊框，請參閱自己在Codepen下面鏈接）： <div class="box"></div> .box { width: 200px; height: 200px; background: green; ma

3熱度

1回答

角NG-顯示/隱藏動畫

我一直在關注效果基本show指導這裏：http://ng.malsup.com/#!/css-animations-for-ng-hide_ng-show 從我除了希望相反的效果。而不是滑動/隱藏點擊，我想要的內容向下滑動/出現在點擊。所以，內容隱藏在負載上。我創建了一個plunker這裏，但似乎沒有工作：http://plnkr.co/edit/12wPKGqn4g3Fctm7NKnA HTM

0熱度

1回答

如何通過頁面滾動前一個div滾動？

我試圖滾動時它在最後滾動整個頁面滾動前通過正確的div來複制這個網站 http://www.trulia.com/ 的效果。怎樣才能達到這種效果？純粹使用CSS還是需要JS？我一直在嘗試使用溢出來複製它，但它不工作一樣。

6熱度

1回答

如何更改Flexbox列中元素的順序？

當元素按列排序時，它們沿着左列向下，然後向右下。如何配置flexbox以顯示垂直向下而不是列向下的元素？例如我想在底部配置在這裏，不頂：我看着flex-direction沒有成功。這甚至可以用flexbox嗎？我有這個目前： #flex-container { background-color: #000; width: 100%; -webkit

0熱度

1回答

背景顏色填充動畫結束偏移

我想在用戶點擊它時「填充」一個圓。主要問題是，當動畫結束時，它會稍微偏移一點。我試圖添加一個margin-top: -1px它，但它的底部然後偏移！我接受任何讓動畫更平滑的建議，但我的主要問題是：爲什麼最終結果偏離頂端一小點，我該如何解決它？ #searchOptions label { display: inline-block; cursor: pointer;