分類目錄歸檔：CSS+DIV

2014
12-03

2014年20款最好的CSS工具

說到WEB設計，不得不介紹介紹CSS工具，CSS工具在這里面扮演很重要的角色，可以簡化無數開發者和設計師的工作，寫出更好的CSS代碼。而網上有非常多的CSS工具，幫助設計師和開發者高效的工作和進行更多創新的創作，設計師和web開發者也把越來越多的CSS工具收入為自身的開發和設計利器。在這篇文章中，我們羅列了2014年最好的20款CSS工具，希望能幫助大家簡化自己的開發工作，創作出更多更好的創新... 繼續閱讀 >

2014
12-03

9款最新炫酷HTML5/CSS3應用推薦

HTML5的強大之處我們已經體驗過很多了，包括HTML5游戲、HTML5視頻，另外結合CSS3，也能創造更多炫酷的動畫特效和實用應用。今天我們要分享9款最新的炫酷HTML5/CSS3應用。如果你喜歡，趕緊分享給你的朋友吧。1、HTML5webkit3D立方體圖片旋轉滑塊應用今天再來分享一款HTML5 3D立方體動畫，這個只是一個3D效果模型，你可以用圖片替換演示中的立方體4個面，這樣就可以將這款HTML5立方體旋轉動畫改造成HTML53D焦... 繼續閱讀 >

2014
12-03

前端必備：六款CSS工具讓代碼充滿魅力

隨著一系列圍繞JavaScript使用所衍生的相關工具，開發人員與設計師們正親眼見證著框架、樣板以及類似技術方案在擴展、標準化以及加快CSS使用方面所作出的巨大貢獻。目前大部分此類方案已經逐步成熟，能夠切實幫助開發人員與設計師們在各類設備平臺上創建出一致性、響應式網站與Web應用程序。我們就六大人氣CSS技術方案與開發人員們進行了交流，旨在了解空前繁榮的風格化工具選項如何支持他們創建出自己的工具并解決項目... 繼續閱讀 >

2014
12-03

CSS字體大小: em與px、pt、百分比之間的對比

CSS樣式最混亂的一個方面是應用程序中文本擴展的font-size屬性。在CSS中,你可以用四個不同的單位度量來顯示在web瀏覽器中的文本大小。這四個單位哪一種最適合Web?這個問題引起了廣泛的爭論。找到一個確定的答案是困難的,因為這個問題,本身就是如此難以回答。接觸這些單位1.  “Ems”(em):“em”是一個可伸縮的單位,用于web文檔媒體展示。一個em等于當前的字體大小,例如,如果文檔... 繼續閱讀 >

2014
12-03

5 款 Linux 下免費的 CSS 編輯器

一臺計算機系統不能沒有操作系統，大公司的開發者也開發過不復雜易于使用的操作系統。而Linux被認為是復雜的系統,它仍然是最常使用的系統，當然不僅僅是開發者和極客會使用，也可能是日常生活中的你或我，也喜歡它。因為它的神奇般的穩定因素和應用的拓展水平，都比WindowsOS好得多?；ヂ摼W上，有很多工具為網頁設計者和開發者而準備的。今天我要分享一款適用于linux用戶的CSS編輯器。請訪問這里并分享你的想法。1... 繼續閱讀 >

2014
12-03

CSS編寫指導規范和建議

在參與規模龐大、歷時漫長且參與人數眾多的項目時，所有開發者遵守如下規則極為重要：保持CSS易于維護保持代碼清晰易懂保持CSS的可拓展性為了實現這一目標，我們要采用諸多方法。本文檔第一部分將探討語法、格式以及分析CSS結構；第二部分將圍繞方法論、思維框架以及編寫與規劃CSS的看法。CSS文檔分析無論編寫什么文檔，我們都應當維持統一的風格，包括統一的注釋、統一的語法與統一的... 繼續閱讀 >

2014
12-03

CSS的力量：用一個DIV畫圖

這些圖片都是用一個DIV繪制出來的，其實原理并不復雜。這些圖片都是由CSS繪制出來的，通過background-image疊加實現，如蘑菇頭的實現，通過 radial-gradient徑向漸變 , linear-gradient線性漸變相互疊加實現，如：div{width:170px;height:140px;background-image:radial-gradient(circleat50%120%,rgba(0,0,0,0.7)23%,rgba(0,0,0,0)48%),linear-gradient(30deg... 繼續閱讀 >

2014
12-03

10個程序員最喜歡的 HTML和CSS 等在線代碼編輯器

一般軟件開發中必備的一樣工具就是代碼編輯器。傳統的代碼編輯器一般都是以軟件安裝包的形式安裝到電腦里面，代碼編輯保存后一般也是通過ftp或者svn等工具提交到服務器的（當然，像.NET開發中MicrosoftVisualStudio這樣強大的集成工具另說了。）。在實際的項目開發中這樣的方式也是挺便捷的。但是，隨著各種云服務的興起，云存儲時代幾乎已經是大勢所趨了。個人或者小公司搭建一個類似的服務自然代價不菲。這時候利用... 繼續閱讀 >

2014
12-03

CSS垂直水平完全居中手冊

居中一直是CSS中被抱怨的典型。為什么實現起來這么辛苦？所以有人被嘲笑。我覺得問題不是沒有辦法做到，只是視情況而定，有很多不同方式，但是很難弄清楚應該用何種方式。因此我寫了這篇文章，希望能把他變得容易點。水平居中 內聯元素（inlineorinline-*）居中?你可以讓他相對父級塊級元素居中對齊.center-children{text-align:center;}塊級元素（blocklevel）居中?你可以通過設置... 繼續閱讀 >

2014
12-03

11個實用的CSS學習工具

1.盒子模型的幻燈片通過3D轉換效果產生的互動的幻燈片。按向左或向右箭頭鍵切換，全屏觀看會有更好的效果。2.CSSDiner通過一個簡單的小游戲讓你學習CSSselector，輸入正確的selector來完成每一關。你也可以通過菜單來選關。3.CSSSelectors交互這是一個簡單可視化CSS選擇器。選擇左邊菜單中的選擇器,選擇的條目就會出現在右邊。4.前端Web開發考查CSS屬性有大小寫之分嗎？5.TheMa... 繼續閱讀 >

2014
12-03

8個提高效率的CSS實用工具

CSS，也就是CascadingStyleSheets，推出于1997年，差不多是17年前，至此為我們開發網頁大開方便之門，協助我們制作出一個又一個驚艷絕倫的網站設計和模板，提升了我們的創造能力，給整體平臺增加了對稱美。網頁設計不是一蹴而就的，需要不斷的實踐和改進，然后在最后期限前完成。如果你在寫CSS代碼上花費大量的時間，那么你就是在浪費資源。因為有很多工具能提高我們改進CSS文件的工作效率。這些工具需要我們先... 繼續閱讀 >

2014
12-03

怎樣用純HTML和CSS更改默認的上傳文件按鈕樣式

如果你曾經試過，你就會知道，用純CSS樣式加HTML實現統一的上傳文件按鈕可能會很麻煩?？纯聪旅娴牟煌瑸g覽器的截圖。很明顯的，他們長得很不一樣。我們的目標是創造一個簡潔，用純CSS實現的，在所有瀏覽器里的樣子和布局是一樣的上傳文件按鈕。我們可以這樣： 步驟1.創建一個簡單的HTML標記 <divclass="fileUploadbtnbtn-primary"><span>Upload</span><inputtype="file"class="upload"/>... 繼續閱讀 >

2014
12-03

這30類CSS選擇器 你必須記在腦袋里！

大概大家都知道id,class以及descendant選擇器，并且整體都在使用它們，那么你正在錯誤擁有更大級別的靈活性的選擇方式。這篇文章里面提到的大部分選擇器都是在CSS3標準下的，所以它們只能在相應最新版本的瀏覽器中才能生效，你完全應該把這些都記在你聰明的腦袋里面。1.**{margin:0;padding:0;}在我們看比較高級的選擇器之前，應該認識下這個眾所周知的清空選擇器。星號呢會將頁面上所有每一個元素都選到。... 繼續閱讀 >

2014
12-03

7個你可能不認識的CSS單位

眾所周知CSS技術我們雖然很熟悉，在使用的過程卻很容易被困住，這讓我們在新問題出現的時候變得很不利。隨著web繼續不斷地發展，對于新技術新解決方案的要求也會不斷增長。因此，作為網頁設計師和前端開發人員，我們別無選擇，必須熟悉我們手上的工具，做到知己知彼，這樣才能百戰不殆。這就意味著有那么些個特別的貨，雖然平常都不怎么會用上，但是一旦某個地方需要它們了，他們就真的是特么得合適不過來了呢。今... 繼續閱讀 >