相同的类名称为不同的部分 [英] Same class names for different sections
问题描述
我为语法编写标记 - Corpora - 商业主题
并以这种方式将其划分为主要部分:
< header>
< div class =roof>< / div>
< nav>< / nav>
< div class =slides>< / div>
< / header>
< div class =content>
< div class =roof>< / div>
< aside>< / aside>
< div class =main>< / div>
< / div>
< footer>
< div class =roof>< / div>
< div class =credit>< / div>
< / footer>
可以使用相同的类名命名页面的不同部分 .roof
?
因此,考虑到我的 .roof
我有不同的风格写作
< header>
< div class =roofHeader>< / div>
< nav>< / nav>
< div class =slides>< / div>
< / header>
< div class =content>
< div class =roofContent>< / div>
< aside>< / aside>
< div class =main>< / div>
< / div>
< footer>
< div class =roofFooter>< / div>
< div class =credit>< / div>
< / footer>
?
在你想让它们以相同的方式对它们进行样式设置或使它们看起来相同的方式之前,没有问题用同样的名称命名不同的部分,就像在你的例子(屋顶)中一样。例如
< header>
< div class =roof>< / div>
< nav>< / nav>
< div class =slides>< / div>
< / header>
< div class =content>
< div class =roof>< / div>
< aside>< / aside>
< div class =main>< / div>
在上面的代码中,标题部分的div看起来与a相同div中的内容部分。
添加更多内容 - 如果您正在编写主题标记 - 最佳做法是 -
-
编写全局样式类
-
-
段样式类
例如: -
部分特定样式
.header {
width:100%;
font-family:Ariel;
font-size:12px;
}
全局样式
.float-right {
float:right;
}
现在.header类将用于标题部分,并且它将为我们提供maximun控制,以更改那里的任何内容并且不会影响除非我们在标记中的其他地方使用它。
.float-right类可以用于任何想要漂浮在右侧的html div或部分。
Im writing a markup for Corpora - A Business Theme
And have divided it into main sections in this way:
<header>
<div class="roof"></div>
<nav></nav>
<div class="slides"></div>
</header>
<div class="content">
<div class="roof"></div>
<aside></aside>
<div class="main"></div>
</div>
<footer>
<div class="roof"></div>
<div class="credit"></div>
</footer>
Is that okay to name different sections of the page with the same class name .roof
?
[Edit]
So, considering my .roof
's have different styling I have to write
<header>
<div class="roofHeader"></div>
<nav></nav>
<div class="slides"></div>
</header>
<div class="content">
<div class="roofContent"></div>
<aside></aside>
<div class="main"></div>
</div>
<footer>
<div class="roofFooter"></div>
<div class="credit"></div>
</footer>
?
No issues naming different section with same Name like in your example(roof) until you want them to style them the same way or make them look the same way .
for example
<header>
<div class="roof"></div>
<nav></nav>
<div class="slides"></div>
</header>
<div class="content">
<div class="roof"></div>
<aside></aside>
<div class="main"></div>
IN the above code the div in the header section will look exactly the same as a div in the content section .
To add more into this - If you are writing a markup for a theme - The best practice would be to -
write global style classes
section specific style classes
for example :- Section specific styling .header{ width:100%; font-family:Ariel; font-size:12px; } Global styling .float-right{ float:right; }
Now the .header class will be used specific for the header section .And it will provide us with maximun control to change anything in there and wont effect other section until and unless we use it somewhere else in our markup .
The .float-right class can be used anywhere in the html divs or section which you want to floated to the right side .
这篇关于相同的类名称为不同的部分的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!