为了模块化目的,链接CSS类或单独命名它们会更好吗？

例如,哪个更好：

方法1(分别命名类)：

/* CSS */

.textBox-red,.textBox-green {
   padding: 10px;
   border: 1px solid #CCC;
   border-radius: 10px;   
}

.textBox-red { color: #900; }
.textBox-green { color: #3c3; }

/*HTML*/

Box-red">Box-green">

要么 – – – – – –

方法2(链类)：

/* CSS */

.textBox {
  padding: 10px;
  border: 1px solid #CCC;
  border-radius: 10px;
}

.textBox.text-red { color: #900; }
.textBox.text-green { color: #3c3; }

/*HTML*/

Box text-red">Box text-green">

两者之间有什么更好的做法？

最佳答案

我的意见是你应该使用模块化的CSS –
您也可以组合类而不是链接它们：

/*CSS*/
.textBox {
  padding: 10px;
  border: 1px solid #CCC;
  border-radius: 10px;
}

.text-red { color: #900; }
.text-green { color: #3c3; }

/*HTML*/

Box text-red">Box text-green">

这样,当您想要没有文本框的红色背景时,可以重复使用红色和绿色.这样,您可以更多地重复使用代码,并且文本框和文本颜色之间存在松散耦合

原文地址：https://www.jb51.cc/css/427137.html

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。