HTML新手求解。关于CSS对于li标签的active状态的背景颜色_html/css_WEB-ITnose
Freigeben: 2016-06-24 11:31:46
Original
2386 Leute haben es durchsucht
譬如对于
我在自己创建的样式表
.test li {
color:#000000;
float: none;
width: 200px;
background: #f9f2f4;
margin-bottom: 3px;
line-height: 80px;
}
问题:怎么样设定li标签在
这种情况下背景颜色变成另外的。 譬如用bootstrap的样式表的时候,在给定的 之类的里面的li标签显示就会直接运行HTML以后在一个标签处显示出背景颜色的变化 怎么修改样式表能让我在自己静态设计中,自己声明了
后能得到不同的背景颜色 不好意思了大神,我感觉代码不多,所以直接贴了。。
回复讨论(解决方案)
.test #ul li.active{ background:#.... } Nach dem Login kopieren
Nach dem Login kopieren
.test #ul li a{ disaplay:inline-block; background:#....}.test #ul li a:active{ background:#.... } Nach dem Login kopieren
Nach dem Login kopieren
.test #ul li.active{ background:#.... } Nach dem Login kopieren
Nach dem Login kopieren
.test #ul li a{ disaplay:inline-block; background:#....}.test #ul li a:active{ background:#.... } Nach dem Login kopieren
Nach dem Login kopieren
大神。我套用你的代码。但是好像没有用啊。首先我link css了。然后在body里是这样的 在我引用的样式表里是这样的 .test li { color: #f5f5f5; float: none; width: 200px; background: #101010; margin-bottom: 3px; line-height: 60px; list-style-type: none;}.test a { color: #f5f5f5; padding-left: 60px;}.test li:hover { display: inline-block; color: #000000; float: none; width: 200px; background: #06b2e3; margin-bottom: 3px; line-height: 60px;}.test #ul li.active { display: inline-block; color: #000000; float: none; width: 200px; background: #f5f5f5; margin-bottom: 3px; line-height: 60px;}.test #ul li a { display: inline-block; color:#000000; float: none; width: 200px; background: #f5f5f5; margin-bottom: 3px; line-height: 60px;}.test #ul li a:active { background: #f5f5f5; float : none; width: 200px; margin-bottom: 3px; line-height: 60px;} Nach dem Login kopieren
目前而言进去网站就是黑背景白字的li标签,鼠标移到上面背景会变成蓝色。但是我设置为class="active"的BBB背景不是我设定的白色的。 还是说想要在网页一开始就显示不同的active需要js? 具体要怎么写?求大神告知。 bootstrap的bootstrap.min.css检索script太多了。不太好找啊
background:#fff;才是白色背景。。。
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
2024-10-22 09:46:29
2024-10-13 13:53:41
2024-10-12 12:15:51
2024-10-11 22:47:31
2024-10-11 19:36:51
2024-10-11 15:50:41
2024-10-11 15:07:41
2024-10-11 14:21:21
2024-10-11 12:59:11
2024-10-11 12:17:31