作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
目前我正在尝试实现我的第一个 HTML5 应用程序,但我遇到了一些关于 HTML/CSS 的一般性问题,特别是在使用 header 标签时。
通常我将 main 标签放在 CSS 规则的开头,因此我可以控制每个属性并且不要混合使用它们中的任何一个。
现在我有这个 CSS 代码:
header div.followUs { float:right; font:Georgia, "Times New Roman", Times, serif; color:#B2B2B2; font-style:italic }
header div.followUs a,a:link,a:active,a:visited { color:orange }
header nav { clear:right; float:right; margin-top:20px }
header nav ul li { float:left; margin-right: 25px; text-transform:uppercase; font-weight:bold }
header nav ul li:last-child { margin-right: 0 }
header nav ul li a { text-decoration:none }
我的 HTML 代码是:
<header>
<div class="header-inner clearfix">
<h1 class="logo">Client KickOff</h1>
<div class="followUs">Segue-nos no <a href="#">Twitter</a> and <a href="#">Facebook</a>.</div>
<nav>
<ul>
<li><a href="/html/">Notícias</a></li>
<li><a href="/html5/">Quem Somos</a></li>
<li><a href="/css/">Os Nossos Produtos</a></li>
<li><a href="/css3/">O Nosso Portefólio</a></li>
<li><a href="/js/">Contacte-nos!</a></li>
</ul>
</nav>
</div>
</header>
它提供与 div 相同的颜色,并将 followUs 类应用于导航项。
有什么想法吗?
最佳答案
header div.followUs a,a:link,a:active,a:visited { color:orange }
字面意思是:
header div.followUs a { color: orange }
a:link { color: orange }
a:active { color: orange }
a:visited { color: orange }
因此您在导航中的链接匹配单个 a:link
规则,因为它未指定在标题和 followUs 部分内。
您需要在每个 a:
选择器前放置 header div.followUs
。不过,您应该只删除额外的 a:
选择器,因为初始的 header div.followUs a
已经涵盖了所有表单。
关于css - div 内的超链接与在 HTML/CSS 中的标签内分配的类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8115124/
我是一名优秀的程序员,十分优秀!