如何使用CSS设计HTML样式？

我都试过了，但我无法弄清楚如何风格这些元素：如何使用CSS设计HTML样式？

<div class="tabs"> 
<ul class="tabsNavigation"> 
<li><a href="#tab1">Tab1</a></li> 
<li><a href="#tab2">Tab2</a></li> 
<li><a href="#tab3">Tab3</a></li> 
</ul>

我会怎么做呢？

来源

2011-02-09 Sjmon

你可以显示你有什么？改变这一点比较容易 – 2011-02-09 23:30:58

你可以添加一些更多的细节来说明你想要达到的目标，到目前为止你已经尝试了什么，还有什么不适合你？ – DigiKev 2011-02-09 23:31:18

只是指

.tabs ul 
{ 
}

或

.tabs ul li 
{ 
}

来源

2011-02-09 23:31:51

Listamatic has many examples和a tutorial

来源

2011-02-09 23:31:05 Quentin

如果你想样式列表本身，使用方法：

ul.tabsNavigation{}

，如果你想样式各li，用途：

ul.tabsNavigation li{}

或链接？

ul.tabsNavigation a{}

来源

2011-02-09 23:31:21 JCOC611

.tabs>ul>li{ /* your style */ }

或

.tabsNavigation>li{ /* your style */ }

请记住，包括你的CSS样式。

来源

2011-02-09 23:35:27 damienix

你想是什么：对于类使用.className和ID的使用#idName

.className { 
style: property; 
} 

#idName { 
style: property; 
}

这里就是你们的榜样的的jsfiddle：

http://jsfiddle.net/Mutant_Tractor/aXdJ9/1/

来源

2011-02-09 23:37:18

你可以做内联样式或使用一个css文件来定义你的样式。内联样式的您可以执行以下操作。这将使div选项卡呈现红色背景。

<div class="tabs" style="background:red;"> 
<ul class="tabsNavigation"> 
<li><a href="#tab1">Tab1</a></li> 
<li><a href="#tab2">Tab2</a></li> 
<li><a href="#tab3">Tab3</a></li> 
</ul>

如果你想在一个CSS文件来定义你的风格，那么你可以参考CSS文件在HTML文件中像这样

<link href="css/yourfile.css" rel="Stylesheet" type="text/css" />

在你的HTML标签定义CSS类：

<ul class="tabsNavigation">

然后在你的CSS文件，你会怎么做

.tabsNavigation{ 
background:red; 
border:1px solid blue; 
width:400px; 
height:300px; 
}

来源

2011-02-10 02:31:02 Hussein

使用运算符“>”（紧随其后），可以防止样式应用于使用基于html的结构中的元素。示例：如果其他DIV，LI这些将不会更改其样式。

DIV.tabs { 

} 
DIV.tabs > .tabsNavigation { 

} 
DIV.tabs > .tabsNavigation > LI { 

} 
DIV.tabs > .tabsNavigation > LI > a { 

}

谢谢。

来源

2011-10-23 16:31:20 HelperUDI

如何使用CSS设计HTML样式？

回答

相关问题