1、css3相鄰元素選擇器，css開發者工具？

CSS是Web開發的基礎之一，目前很多人正在學習和使用。今天，給大家介紹幾款CSS開發工具，讓你快速成為開發高手。

（一）在線學習CSS

1、Flexplorer

Flexbox能在屏幕上實時查看效果以及代碼。還可以編輯文本框，并查看文本框的響應式布局代碼。這種學習方式非常有趣，很適合新手。

2、Grid Garden

這個是通過互動游戲，來提示你編寫CSS代碼來種植胡蘿卜園。這也是一個有趣的學習方式，確保新手小白以引人入勝的方式學習CSS Grid的基礎知識。游戲包含28個級別，每個級別都需要你編寫CSS代碼段才能完成。

（二）學習制作工具

1、Patternizer和Patternify

通過這兩種工具，可以在用戶友好的界面中使用CSS創建出色的模式。而且它是直接用CSS編寫的，可以輕松地在網站上實現使用。

2、EnjoyCSS

這個工具非常簡單，是可以使用一些簡單的UI設計元素，然后通過這個工具將其轉換為CSS代碼。EnjoyCSS極大地改變了我的工作流程。由于易于使用，能使我們花費在創建復雜CSS樣式上的時間和精力減少，很容易就能得到復雜的CSS效果。

3、CSSmatic

這個多合一的工具，它可以幫你實現生成漸變、邊框半徑、噪點紋理、盒子陰影等效果，所有這些都包含一個簡單直觀的UI。作為前端開發人員，該工具是很必要的。

4、CSS Arrow please

此工具可幫助你創建和導出帶有箭頭的自定義的代碼提示框。盡管從頭開始編寫代碼聽起來很復雜，但該工具只需單擊幾下即可提供可用的代碼。獲得代碼后，就可以復制代碼并對其進行一些更改。

2、css3和css一樣嗎？

CSS3是CSS的子集，CSS3是最新的標準，提供了很多好用的新屬性，提升了網頁的表現性。

CSS3提供了更好用的選擇器

最新的CSS3中，對偽類、偽元素選擇器做了嚴格的規范。有了偽類后，不用在div標簽里面添加額外的元素完成一些DOM操作，可以通過::before,::after完成，代碼簡潔明了。對于鼠標的操作，也可以通過::hover等類似的操作完成。非常高效。還有::first–child等類似的選擇器去操作子元素。

CSS3使動畫效果越來越方便

css3里面通過animation來完成動畫，設置@keyframes即可，一些輕量級的動畫不必再通過js完成。

CSS3完成圓角、陰影美化更方便

以前的css完成類似的功能只能通過圖片做背景，現在只需要border-radius、boxshadow即可。非常高效簡潔。

CSS3提供了全新的盒模型

這個特性十分有用。原來的盒模型width=content.+border+padding。你規定了width.每次都要自己計算，現在有了boder-box不用這么麻煩了。

CSS3的flex布局是最強大的

IE已死，不需要再考慮它的兼容性！！！用flex布局，節省很多時間，節省的時間可以學很多東西，而不是浪費時間去適應落后的ie！！！

還有很多好用的css3特性，這個版本提供了巨大的生產力！！！很感謝它，期待下一個grid布局～

以上是我的看法～

3、CSS父元素的子元素樣式控制另一子元素怎么實現？

你說講的這應該是同級兄弟元素之間的CSS控制。話說有一種選擇器就叫兄弟元素選擇器，分為臨近兄弟和普通兄弟。臨近兄弟：用 ＋ 表示，只匹配該元素后邊的第一個同級元素。普通兄弟：用 ～ 表示，匹配該元素后邊的所有同級元素。給個例子：

sdf

sdfsdf當把p的class設為on的時候，span的樣式也跟著改變。不知道這么說清楚沒有。另外這種方式IE6是不支持的。慎用吧。

4、css調試工具？

css說是調試工具其實只是一段 Javascript 代碼，但非常實用，它會給頁面里所有的 DOM 元素添加一個 1px 的描邊（outline），方便我們在調試 CSS 過程中分析、排查問題。

先來看看代碼，它有兩個版本，一個是使用的$$選擇器，代碼量更少（瀏覽器控制臺支持 $$ 選擇器）；另一種就是傳統的document.querySelectorAll選擇器：