在线CSS有什么不好的？

Question

在线CSS有什么不好的？当我看到网站初学者代码和示例时，CSS总是位于一个单独的文件中，命名为“main.css”、“default.css”或“Site.css”。然而，当我对页面进行编码时，我常常会尝试将css与DOM元素一起抛出，例如在图像上设置“Float：right”。我觉得这是“糟糕的编码”，因为在示例中很少这样做。我理解，如果要将样式应用于多个对象，明智的做法是遵循“不要重复自己”(Dry)，并将其分配给每个元素要引用的CSS类。但是，如果我不会在另一个元素上重复CSS，为什么不在我编写HTML的时候使用CSS呢？问题是：使用内联css是否被认为是不好的，即使它只用于该元素？如果是，为什么？例子(这很糟糕吗？)：<img src="myimage.gif" style="float:right" />

Answer 1

当您想要使站点看起来不同时，必须更改100行代码。这在您的示例中可能不适用，但如果您使用内联CSS来执行以下操作

<div style ="font-size:larger; text-align:center; font-weight:bold">

在每一页上表示一个页眉，它将更容易维护为

<div class="pageheader">

如果页面标题是在单个样式表中定义的，以便如果您想要更改整个站点的页面标题的外观，那么您可以在一个地方更改CSS。

然而，我将是一个异教徒，并说，在你的例子，我认为没有问题。您的目标是单个图像的行为，该图像可能必须在单个页面上正确显示，因此将实际的CSS放在样式表中可能会过分。

Answer 2

拥有不同的css文件的好处是

1. 易于维护html页面
2. 改变外观和感觉是很容易的，你可以在你的页面上支持许多主题。
3. 您的CSS文件将被缓存在浏览器端。因此，您将贡献一些互联网流量，不加载一些KBS的数据，每次页面被刷新或用户导航您的网站。

Answer 3

HTML 5快速CSS原型化方法

或：<style>标签不再是只为头部！

黑客CSS

假设您正在调试，并且希望修改页面-css，只需使某个部分看起来更好。与其以快速、肮脏和不可维护的方式创建样式，不如做我这些天所做的事情，并采取分阶段的方法。

没有内联样式属性

不要内联地创建CSS，我的意思是：<element style='color:red'>甚至<img style='float:right'>它非常方便，但在以后的实际CSS文件中并不反映实际的选择器特性，如果您保留它，您稍后会后悔维护负载。

原型机<style>相反

，而不是在页面中使用内联css。<style>元素。试试看！它在所有浏览器中都很好，因此对测试非常有用，而且允许您在需要/需要时将此类CSS优雅地移出到全局CSS文件中(*只需注意选择器只具有页面级别的专用性，而不是站点级别的专用性，因此要注意不要过于笼统)与CSS文件一样干净：

<style>.avatar-image{
    float:right}.faq .warning{
    color:crimson;}p{
    border-left:thin medium blue;
    // this general of a selector would be very bad, though.
    // so be aware of what'll happen to general selectors if they go    // global}</style>

重构他人的内联CSS

有时候你甚至不是问题，你在处理别人的内联CSS，你必须重构它。这是对<style>在页面中，这样您就可以直接删除内联CSS，并在重构时立即将它放在类、ID或选择器中。如果您在使用选择器时足够小心，那么只需复制和粘贴，就可以将最终结果移到全局CSS文件的末尾。

有点难以转移每一，每个直接指向全局css文件的css位，但在页面中使用。<style>元素，我们现在有了其他选择。