纯CSS关于display的用法
网页中一段内容之后只显示三角图片
而鼠标移动到或者点击这个三角符号之后变成倒三角
，同时隐藏此三角符号，并且显示一个下拉列表出来
本人是初学者，不用javascript.
只用display元素如何实现
一万年的距离浏览 1395回答 2
2回答
-
雾青依
感觉和那种导航差不多，我在这里贴一段导航的代码吧，不美观啊，勿喷<html> <head> <title></title> <style> *{ margin:0; padding:0; } #nav{/*把列表符号去掉*/ list-style:none; } #nav li ul{/*隐藏下拉内容*/ display:none; list-style:none; margin:0px; } #nav li{/*定义一级导航样式*/ color:red; width:200px; background:yellow; } #nav li ul li{/*定义下拉内容样式*/ background:green; margin-bottom:5px; } #nav li:hover{ color:red; } #nav li:hover ul{/*鼠标移到一级导航上方的时候显示下拉内容*/ display:block; } #sp{ float:right; } </style> </head> <body> <ul id="nav"> <li>导航<span id="sp">三角</span> <ul> <li>导航一 </li> <li>导航二 </li> <li>导航三 </li> </ul> </li> </ul> <body> </html> -
迷途的马尔斯
用到伪类选择器(:hover)就好了，鼠标移动到的时候是hover的样式
随时随地看视频慕课网APP
Html/CSS