<head> 里面的 <style> 里的信息如此杂乱无章是什么原因？

Question

我是 HTML 初学者。我看到很多网站，即使是非常简单的网站，在头部都有大量的样式信息，例如下面的代码（我只从一个网站复制了大约 10% 的实际样式信息）。

问题：

信息如此混乱的原因是什么？

"style" 似乎常常以 { display: none!important; } 结尾 </style>。为什么这 "none!important" 很重要？

<style type="text/css">
    object[width="640"][height="160"],
    object[width="640"][height="100"],    
    embed[width="640"][height="160"],
    object[width="100"][height="100"],
    iframe[width="100%"][height="60"],
    object[width="300"][height="60"],
    object[width="200"][height="200"],
    object[width="1000"][height="250"],
    object[width="1000"][height="270"], 
    img[width="240"][height="400"], 

    #RightAdBlock, 
    .ad_head_rectangle, 
    object[width="300"][height="300"], 
    iframe[width="100%"][height="250"], 
    #ad_global_below_navbar, 
    #ad-background, 
    #AD_banner, 
    #AdColumn, 
    #AdContainer, 
    #AdHeader, 
    #AdImage, 
    #Adcode, 
    #AdvertiseFrame, 
    #Advertisements, 
    #BottomAdContainer, 
    . . . . . . iframe[src^="http://ad.yieldmanager.com/"], 
    #rhs_block > #mbEnd, 
    #tads.c { 
        display: none!important; 
    }
</style>

Answer 1

正如 type="text/css" 中的 type 属性所声明的，样式标签内的任何内容都是 CSS 或 Cascading Style Sheets。 CSS 允许您使用颜色、间距、字体等设置网页样式...

这是开发现代网站所需的三个基本 "languages" 之一：

Html: 内容
CSS: 样式
JavaScript：逻辑

样式标签看起来乱七八糟的原因是因为通常您会在一个完全独立的文件中找到这些样式。所以基本上你会看到整个文件被推到一行中。有时出于性能原因这样做。

为了回答您关于 { display: none !important } 的问题，display: none 隐藏了一个元素，而 !important 只是一个极端的措施，以确保没有任何东西可以用其他方式设置它的样式。

<head> 里面的 <style> 里的信息如此杂乱无章是什么原因？

What is the reason for the huge clutter of information in <style> inside the <head>?

html

styles