如何将CSS类转换为id？

这是CSS代码...如何将CSS类转换为id？

.breadcrumb { 
    font-size: 10px; 
    background-color: #006600; 
    padding: 0px 2px 2px 2px; 
    text-align: center; 
    color: #FFFFFF; 
} 

.breadcrumb a { 
    color: #FFFFFF; 
    text-decoration: none; 
} 

.breadcrumb a:visited, .breadcrumb a:active { 
    color: #FFFFFF; 
} 

.breadcrumb a:hover { 
    text-decoration: underline; 
}

，这是我使用的显示面包屑的代码...

<p class="breadcrumb">Breadcrumb PHP code goes here</p>

我想要的CSS代码进行修改，这样我可以用id代替class，如：

<p id="breadcrumb">Breadcrumb PHP code goes here</p>

有人可以帮忙吗？

来源

2011-09-02 Aahan

将您的CSS中的.更改为#。

话虽如此，如果您要使用id选择器，那么您应该确保在任何给定的时间在您的页面上只会有一个p的单个实例。

来源

2011-09-02 02:53:56

你的意思是我应该只使用'

@Aahan：对.. –

所有你需要做的就是改变'。'至 '＃'。就像@Demian Brecht说的那样，你应该确保你的页面上只有一个id =“breadcrumb”的元素。除非你确定只有其中之一，否则你可能会更好地坚持上课。

CSS类选择器对页面性能没有太大的影响。我通常只使用ID作为布局元素，然后尝试将所有其他选择器保留为类。当你想重复使用多个元素的样式时，它会有所帮助。然而，ID的确会为脚本提升性能，但如果你在有ID的标签的上下文中搜索类，性能仍然非常好。

下面介绍如何修改它。

#breadcrumb { 
    font-size: 10px; 
    background-color: #006600; 
    padding: 0px 2px 2px 2px; 
    text-align: center; 
    color: #FFFFFF; 
} 

#breadcrumb a { 
    color: #FFFFFF; 
    text-decoration: none; 
} 

#breadcrumb a:visited, #breadcrumb a:active { 
    color: #FFFFFF; 
} 

#breadcrumb a:hover { 
    text-decoration: underline; 
}

来源

2011-09-02 03:13:17

非常感谢您的澄清。 – Aahan

如何将CSS类转换为id？

回答

相关问题