分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 代码编程

HTML div鼠标悬停控制子控件显示与隐藏

发布时间:2023-09-06 01:34责任编辑:白小东关键词:HTMLdiv鼠标悬停

HTML div鼠标悬停控制子控件显示与隐藏

 1 <!DOCTYPE html> 2 <html> 3 <head> 4 ????<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 ????<title></title> 6 ????<meta charset="utf-8" /> 7 ????<style type="text/css"> 8 ????????#divF{ 9 ????????????width:300px;10 ????????????height:300px;11 ????????????background-color:coral;12 ????????}13 ????????????#divF:hover #divC {14 ????????????????display:block;15 ????????????}16 ????????#divC {17 ????????????width: 300px;18 ????????????height: 100px;19 ????????????background-color: cadetblue;20 ????????????display: none;21 ????????????transition:all.5s;22 ????????}23 ????</style>24 </head>25 <body>26 27 ????<div id="divF">28 ????????<div id="divC">29 30 ????????</div>31 ????</div>32 </body>33 </html>

HTML div鼠标悬停控制子控件显示与隐藏

原文地址:https://www.cnblogs.com/TinHead/p/8213714.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved