将类名分配给<img>标签而不是在css文件中写入？

Question

我很想知道,将类名称分配给<img>html文件中的标记而不是直接写入css文件更好吗？

<div class="column">
   <img class="custom-style" alt="" />
   <img class="custom-style" alt="" />
   <img class="custom-style" alt="" />
</div>

代替

.column img{/*styling for image here*/}

我需要知道这些在网络性能方面有什么不同吗？

更新:

对不起,假设问题是<img>里面有多个标签.column div,所有图像都使用相同的样式.

Answer 1

简短的回答是直接向要添加样式的元素添加一个类确实是目标和样式元素的最有效方法.但是,在现实世界的情况下,它是如此微不足道,以至于根本不担心这个问题.

引用Steve Ouders(CSS优化专家)http://www.stevesouders.com/blog/2009/03/10/performance-impact-of-css-selectors/:

根据测试,我有以下假设:对于大多数网站,优化CSS选择器可能带来的性能提升很小,并且不值得花费.

在现实世界的场景中,代码的可维护性更为重要.由于这里的基本主题是前端性能; 快速页面渲染的真正性能提升器可在以下位置找到:

• 减少HTTP请求
• 使用CDN
• 添加Expires标头
• Gzip组件
• 将样式表放在顶部
• 将脚本放在底部
• 避免CSS表达式
• 使JS和CSS外部
• 减少DNS查找
• 缩小JS
• 避免重定向
• 删除重复的脚本
• 配置ETag
• 使AJAX可缓存

资料来源:http://stevesouders.com/docs/web20expo-20090402.ppt

所以只是为了确认,答案是肯定的,下面的例子确实更快,但要注意更大的图景:

<div class="column">
   <img class="custom-style" alt="appropriate alt text" />
</div>