display none block(JQ控制CSS中的display:none,block怎么改)
本文目录
- JQ控制CSS中的display:none,block怎么改
- css中把一个div设置display: none属性,等到display: block的时候会有一个换行的效果,我不想换行
- 纯CSS实现多个display:none到display:block切换
JQ控制CSS中的display:none,block怎么改
$(document).ready(function(){ $("#div1").click(function(){ $("div").toggle(); });});
css中把一个div设置display: none属性,等到display: block的时候会有一个换行的效果,我不想换行
官方文档:block 此元素将显示为块级元素,此元素前后会带有换行符。 inline 默认。此元素会被显示为内联元素,元素前后没有换行符。 所以把block改成inline就不会出现换行了
纯CSS实现多个display:none到display:block切换
纯CSS实现tab切换:***隐藏网址******隐藏网址***《head》***隐藏网址***《title》CSS_Tab《/title》《style type="text/css"》body{margin:0; font-size:12px; background:#666;}#box{width:400px; height:300px; margin:100px auto 0;}#tab_nav{margin:0; padding:0; height:25px; line-height:24px;}#tab_nav li{float:left; margin:0 3px; list-style:none; border:1px solid #999; border-bottom:none; height:24px; width:60px; text-align:center; background:#FFF;}a{font:bold 14px/24px "微软雅黑", Verdana, Arial, Helvetica, sans-serif; color:green; text-decoration:none;}a:hover{color:red;}#tab_content{width:398px; height:273px; border:1px solid #999; font:bold 4em/273px "微软雅黑", Verdana, Arial, Helvetica, sans-serif; text-align:center; background:#FFF; overflow:hidden;}#t_1,#t_2,#t_3{width:100%; height:273px;}《/style》《/head》《body》《div id="box"》《ul id="tab_nav"》 《li》《a href="#t_1"》tab_1《/a》《/li》 《li》《a href="#t_2"》tab_2《/a》《/li》 《li》《a href="#t_3"》tab_3《/a》《/li》 《/ul》 《div id="tab_content"》 《div id="t_1"》tab_壹《/div》 《div id="t_2"》tab_贰《/div》 《div id="t_3"》tab_叁《/div》 《/div》《/div》《/body》《/html》