Question

css中display怎么做显示或隐藏

就像这样的，点击上面，下面会出现相应的内容，看了半天的文字介绍还是没弄明白。求大神指导下，到底应该怎么做。

Answer 1

只需设置

display:none;

即可将该元素设为隐藏的。默认的是显示的，即不设置display即默认显示。

isplay 属性规定元素应该生成的框的类型，定义建立布局时元素生成的显示框类型。

display的值可以取如下的值：

none    此元素不会被显示。    

block    此元素将显示为块级元素，此元素前后会带有换行符。    

inline    默认。此元素会被显示为内联元素，元素前后没有换行符。    

inline-block    行内块元素。（CSS2.1 新增的值）    

Answer 2

在这个例子中，基本上是靠javascript控制的，当点击某一个tab时，执行javascript代码，改变相应的内容元素的css display属性，让其显示或隐藏。其中在css中，display:none就是隐藏，display:block或display:inline等都是显示。

Answer 3

参考代码 如下

<style>
.dv1{width:200px;clear:both;height:30px;}
span{float:left;margin-right:10px;cursor:pointer;}
.dv2{width:100px;height:100px;line-height:25px;border:1px solid red;}
</style>

<div class="dv1">
<span id="wz">网址</span>
<span id="dsj">电视剧</span>
<span id="dy">电影</span>

</div>
<div class="dv2" id="dv2"></div>
<script src="jquery-1.4.2.js"></script>
<script>
$("span").click(function(){
var txt = $(this).text();

$("#dv2").text(txt);
});
</script>

Answer 4

Answer 5

display:none是隐藏，block显示