实现下拉

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
ul{
list-style-type: none;
}
.a{
display: none;
}
.b:hover~ .a{
display:inline;
}
</style>
<title></title>
</head>
<body>
<ul>
<li class="b">手机品牌</li>
<li class="a">华为</li><br/>
<li class="a">小米</li><br/>
<li class="a">苹果</li><br/>
</ul>
</body>
</html>

css3(display)的更多相关文章

  1. 转: css3: display:box详解

    示例见:  css3: flexbox (BTW: blog不能包含iframe script真不方便啊~~) display:box;box-flex是css3新添加的盒子模型属性,它的出现可以解决 ...

  2. CSS3 display:flex和display:box有什么区别

    父级元素有display:box;属性之后.他的子元素里面加上box-flex属性.可以让子元素按照父元素的宽度进行一定比例的分占空间. 如: html: <article>   < ...

  3. Css3 display用法

    display 属性规定元素应该生成的框的类型. display:none   此元素不会被显示 display:block   此元素将显示为块级元素,此元素前后会带有换行符 display:inl ...

  4. CSS3 display:flex和display:box有什么区别?

    **区别**,仅是各阶段草案命名.- W3C 2009年第1次草案:[display:box;](https://www.w3.org/TR/2009/WD-css3-flexbox-20090723 ...

  5. css3 display:box

    想做自适应的流体布局 box很有用 . 还没有得到firefox.Opera.chrome浏览器的完全支持,但可以使用它们的私有属性定义firefox(-moz-).opera(-o-).chrome ...

  6. css3 display:box 属性

    先看例子: .ub{ display: -webkit-box !important; display: box !important; position:relative;}.ub-f1{ posi ...

  7. css 垂直同步的几种方式

    第一种: 利用 display:table 和 display:table-cell 的方式 这种方式就好像将table布局搬过来一样,相信大家对table的td还是有印象的,它的内容是可以设置垂直居 ...

  8. flex属性的学习

    1.需要记住的属性和值. ------------------------------------------------------------- 方向横和纵 flex-direction: row ...

  9. css等比例分割父级容器(完美三等分)

    html部分代码: 方法一: 浮动布局+百分比 (将子元素依次左浮动,根据子元素的个数,设定每个子元素的宽度百分比) 方法二:行内元素(inline-block)+百分比 方法三: 父元素  disp ...

随机推荐

  1. Maven 下载、安装、配置学习

    一.Maven 下载与安装 电脑已安装:JDK.Eclipse 1.下载Maven:http://maven.apache.org/download.cgi 2.解压并安装:解压路径名不能有中文! 3 ...

  2. djangorestframework-jwt自带的认证视图进行用户登录验证源代码学习

    Django REST framework JWT djangorestframework-jwt自带的认证视图进行用户登录验证源代码学习 SECRET_KEY = '1)q(f8jrz^edwtr2 ...

  3. RF:win10跑用例过程中有中文日志会显示非中文

    问题:RobotFramework在win10跑用例过程中有中文日志会显示非中文,如截图: 解决:  C:\Python27\Lib\site-packages\robot\utils\unic.py ...

  4. zabbix3.x添加华为(93069306)网络设备详解

    转载自:https://www.cnblogs.com/yinzhengjie/p/6768006.html 前言: 欢迎加入:高级运维工程师之路 598432640 相信大家在看我的文章之前,也看过 ...

  5. oracle增加记录谁在连接你的数据库

    我们都知道在v$session 中记录着客户端的机器名称,但是没有IP , 如果记录clinet ip 呢? 有两种思路: ①    利用trigger,后面就是这种方式 ②    利用 DBMS_S ...

  6. 吴恩达Machine Learning 第一周课堂笔记

    1.Introduction 1.1 Example        - Database mining        Large datasets from growth of automation/ ...

  7. HTTP客户端识别与Cookie机制

    HTTP识别用户的几种技巧 承载用户身份信息的HTTP首部 客户端IP地址跟踪,通过用户的IP地址对其进行识别 用户登录,用认证方式识别用户 胖URL,一种在URL中潜入识别信息的技术 cookie, ...

  8. pyqt-QGrapicsView 坐标系详解

    PTQT——GraphicsView框架 转载 原网址 http://blog.51cto.com/9291927/1879128 一.GraphicsView框架简介 QT4.2开始引入了Graph ...

  9. sql 判断两条数据库查询语句结果是否有重复

    select 身份证号 from (select 身份证号 from 表1 where 考试名称= 'aaa'union allselect 身份证号 from 表2 where 考试名称= 'bbb ...

  10. vue 动态添加 <style> 样式 vue动态添加 绑定自定义字体样式

    created(){ //动态添加自定义字体样式 let style = document.createElement('style'); style.type = "text/css&qu ...