【翻译】VisualStudio11中的CSS编辑器改进(asp.net 4.5系列)-ScottGu
這是我所發的關于ASP .NET 4.5系列博文的第七篇文章。
下一個版本的.NET和Visual Studio包括大量的新特性和新功能
在開發ASP.NET 4.5 WebForms和Mvc的時候
你會看到很多功能上的改進
(不管是基于核心ASP.NET還是一些其他的擴展)
在本篇文章中將會涵蓋
下一個版本的VisualStudio關于支持在ASP.NET中使用CSS3的一些改進
CSS Color Picker
在VisualStudio的早起版本中,
CSS編輯器的智能提示引擎包括了一個顏色名稱的下拉列表(硬編碼)
新版本的VisualStudio
使用了一個功能齊全的顏色選擇器
可以很容易的創建新的顏色樣式
也可以很容易的從樣式表內選擇其他地方使用過的顏色
當你使用CSS編輯器編輯一個CSS樣式的顏色屬性時
一個顏色拾色器將會自動出現
默認情況下
他顯示了之前您使用過的顏色
以及一些推薦使用的顏色
你可以使用鼠標或者鍵盤在這個列表中選擇一個顏色
你可以選擇”+”圖標以展開一個更精細顏色選擇列表
移動opacity(透明度)滑塊,
可以控制alpha通道自動把任何顏色轉化成CSS3 RGBA值
還有一個“顏色選擇”功能
可以讓你使用“吸管”工具從瀏覽器或其他應用程序中拾取顏色
(譯者:造就該有這個功能了!)
在這個60秒的視頻中,演示了顏色拾取器的使用方法
跨瀏覽器和CSS3片段
寫樣式表時,有時會有一些重復的工作,
經常會為不同版本的瀏覽器寫兼容樣式
在某些情況下需要寫五個相同的值
為了支持所有的瀏覽器
必須做這些乏味的工作
在新版本的VisualStudio中
支持CSS片段,自動生成所有瀏覽器廠商的特定屬性
這意味著沒有更多繁瑣的搜索和打字工作以使你的CSS兼容所有瀏覽器
css片段就像我們在VS中使用其他代碼片段一樣
(譯者注:關于CodeSnippet的內容,請參看這里)
例如:調用CSS3的transition屬性
只要簡單的輸入“transition”或者從智能提示中選擇此樣式即可
然后按tab鍵,VisualStudio會執行CSS的transition的代碼片段
并生成相應的代碼,以支持所有的瀏覽器!
并且可以只改一次樣式值,就可以把所有選中值都改掉
(譯者:真好啊!)
點此觀看關于CSS代碼片段的六十秒視頻
CSS層級縮進
現實中,開發網站的樣式表代碼時,
你會發現保持良好的縮進和層級關系已經成為一個趨勢
一個樹狀的CSS樣式
可以更好的體現樣式之間的層級關系
和在樣式屬于哪些網頁中的元素
在VisualStudio的早期版本中
手動保持這些層級縮進是比較繁瑣的工作
如果你格式化CSS代碼(譯者注:這里應該是指按快捷鍵ctl+e,d),
會清空所有的層級和縮進
這就要求你必須謹慎的使用代碼格式化功能
在VisualStudio的下一個版本中,
加入了創建CSS的層級結構的功能
并且可以只格式化選中的內容
這使得審查復雜的樣式關系和樣式間的層級關系變得非常容易
VisualStudio中全新的CSS編輯器也支持常見的CSS? hack
這方面的內容也會體現在CSS的層級結構中
關于CSS層級結構和60秒視頻
小節
在asp.net和VisualStudio的新版本中將更容易的使用CSS
這篇文章包括一些我們在VS上支持CSS編輯器的改進
總結
以上是生活随笔為你收集整理的【翻译】VisualStudio11中的CSS编辑器改进(asp.net 4.5系列)-ScottGu的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 你会利用css写下拉列表框吗?
- 下一篇: php 判断PC 还是 telphone