CSS样式指南问题
CSS样式指南问题
提问于 2010-03-24 11:58:02
关于使用CSS设置HTML元素样式的最佳实践是什么？设置HTML元素样式的首选粒度是多少？也就是说，你有很多
div.searchbox input
div.searchbox p
div.searchbox p.help或
input.searchbox
p.searchbox
p.searchboxhelp哪种css代码被认为易于维护？使用网格框架和重置被认为是最佳实践吗？
谢谢
回答 2
Stack Overflow用户
回答已采纳
发布于 2010-03-24 12:04:03
我完全喜欢第一种方法。搜索框是具有特定样式规则的已定义实体。如果搜索框具有页面上其他元素都没有的独特视觉设置，通常情况下就是这样。
另外，如果有任何全局规则，您可以在样式表的不同部分中全局定义它们：
input { font-size: 16px; color: blue }如果页面上的许多输入元素(不是所有在搜索框中)应该共享任何规则(例如，“搜索输入字段，登录输入字段应该突出一点，并具有黄色背景”)，您可以在“本地”规则之外创建一个全局类：
input.highlight { background-color: yellow }并将该类定义添加到每个输入：
<div class="searchbox">
<input type="text" class="highlight"> <!-- Gets applied the "highlight"
and the "searchbox" styles -->
</div>但基本的基础应该始终是一组“本地”规则，就像您在第一个示例IMO中所做的那样。
Stack Overflow用户
发布于 2010-03-24 17:34:15
我通常会尝试在以下几个方面达成妥协：
input.searchbox和
body div#layout div#main div#content div.section div.subsection form input.searchbox页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/2507371
复制
相似问题
推荐CSS样式指南
Github的CSS样式指南
CSS浮动属性问题(+指南)
CSS样式问题
CSS样式问题
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
社区富文本编辑器全新改版！诚邀体验～
全新交互，全新视觉，新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能，全面提升创作效率和体验
腾讯云开发者
