css布局命名時怎么盡量避免下劃線

這篇文章主要介紹了css布局命名時怎么盡量避免下劃線的相關知識，內容詳細易懂，操作簡單快捷，具有一定借鑒價值，相信大家閱讀完這篇css布局命名時怎么盡量避免下劃線文章都會有所收獲，下面我們一起來看看吧。

　　用過csshack的朋友應該知道，用下劃線命名也是一種hack，如使用“_style”這樣的命名，可以讓ie外的大部分瀏覽器忽略這個樣式的定義，所以使用“_”做為命名時的分隔符是不規范的。在做css檢查時會出現錯誤提示，因此要避免使用下劃線命名。

　　為此得找一個能代替下劃線而又合規范的符號，當然不是一定要用這種分隔符之類的，只是個人習慣問題。

　　做了個小測試，將下劃線分別用了“~”、“$”、“`”、“&”和“－”去代替，結果只有“－”號是可以使用的，而且對js的支持也正常，看下測試：

　　以下為引用的內容：

　　css部分：

　　代碼如下：

　　.try-a{color:#00f;}

　　.try~a{color:#00f;}

　　.try`a{color:#00f;}

　　.try&a{color:#00f;}

　　.try$a{color:#00f;}

　　.try-b{color:#f00;}

　　.try~b{color:#f00;}

　　.try`b{color:#f00;}

　　.try&b{color:#f00;}

　　.try$b{color:#f00;}

　　html部分：

　　代碼如下：

　　<divid="a"class="try-a">try1</div>

　　<divid="b"class="try~a">try2</div>

　　<divid="c"class="try`a">try3</div>

　　<divid="d"class="try&a">try4</div>

　　<divid="e"class="try$a">try5</div></p><p><inputtype="button"value="ok"onclick="b（）；"/>

　　js部分：

　　代碼如下：

　　functionb（）{

　　document.getelementbyid（"a"）。classname="try-b";

　　document.getelementbyid（"b"）。classname="try~b";

　　document.getelementbyid（"c"）。classname="try`b";

　　document.getelementbyid（"d"）。classname="try&b";

　　document.getelementbyid（"e"）。classname="try$b";

　　}

　　結果是“try1”變成了紅色，顯示正常。不過在css定義里，經常會用到id選擇符，如果在頁面中的id命名中使用了“_”，就免不了在css樣式里出現下劃線“_”了，所以在此還得注意在id的命名上也要避免使用下劃線。

關于“css布局命名時怎么盡量避免下劃線”這篇文章的內容就介紹到這里，感謝各位的閱讀！相信大家對“css布局命名時怎么盡量避免下劃線”知識都有一定的了解，大家如果還想學習更多知識，歡迎關注億速云行業資訊頻道。