CSS大綱最佳實踐

爲晚，出現了在執行下列操作實踐一些偉大的文章（和大驚小怪）：CSS大綱最佳實踐

a, input, textarea, button { 
    outline: none; 
}

大多數似乎都與可訪問性問題。

這不是我的意圖完全刪除此功能（如上面的代碼所示）... 但是，此功能很好地混淆了我的原始設計，在不受歡迎的區域中添加了非預期的邊框（erm，輪廓？）。

與此的主要問題是，這些輪廓，被錯誤命名，因爲他們，實際上勾勒出元件周圍的矩形區域，而不是它的輪廓（例如，它忽略了邊界半徑等）。

讓我們看一個例子好嗎？

http://jsfiddle.net/x5Mex/

唯一的解決方案是有上面的代碼運行和使用我自己的系統。就像我們總是與Web瀏覽器反正沒有...

來源

2012-02-14 Christian

確實。輪廓位於邊界外部的矩形區域周圍。它不考慮圓角。

沒有什麼錯禁用的輪廓，只要確保你添加一些其他的輔助功能對於使用鍵盤，例如人，改變你的背景顏色上的焦點

Example

來源

2012-02-14 10:04:57

嗯應該想到的是自己！謝謝。 – Christian 2012-02-14 10:06:41

+1 - 但一個警告;確保您的替換物足夠明顯。用稍暗的邊框代替淺灰色的邊框對於一些人來說很難分辨出來。雖然您可以看到顏色變化，但一旦控件具有焦點（在本例中），它不會「看起來很專注」。因此，您需要考慮整體頁面設計，以便在整個頁面/網站中提供一致的焦點風格突出顯示，並且當前關注的項目視覺上很明顯，並且從非重點項目中突出顯示。 – BrendanMcK 2012-02-15 00:10:20

的確，這僅僅是一個例子，但是，你應該讓變化顯而易見@ChristianSciberras。 – 2012-02-15 07:16:48

由於許多表單元素，按鈕元素在瀏覽器中具有不同的效果，並且需要儘可能多的修復...

http://fvsch.com/code/button-css/來自F. Verschelde should let你圍繞整個元素輪廓按鈕，而不圍繞其內容。

來源

2012-02-16 19:10:15 FelipeAls

CSS大綱最佳實踐

回答

相關問題