关于CSS中display

display是设置元素显示的方式:
block是一块状元素的方式显示，
inline是以内联元素的方式显示，
none是不不显示；
block:块状元素会单独占据一样，其他元素跟他在同一行的会被迫换行，挤到下一行那里去，inline则不会这样


当你在页面中要隐藏一个div的时候，但是在某个条件这下又要让他展示出来。这个时候你可以试一下这个属性

<div class="form-group">
    <label for="inputname" class="col-sm-2 control-label">商品类型</label>
    <div class="col-sm-10">
        <select id="categoryId"  class="form-control">
            <option class="selector" value="1">保健品</option>
            <option class="selector" value="3">书籍</option>
            <option class="selector" value="3">器械</option>
            <option class="selector" value="4">膏药</option>
            <option class="selector" value="100">会员卡</option>
            <option class="selector" value="200">服务项目</option>
            <option class="selector" value="300">套餐</option>
        </select>
    </div>
</div>

这是一个下拉选择





<div class="form-group   selecttor" style="display: none">
    <label for="inputname" class="col-sm-2 control-label">储值</label>
    <div class="col-sm-10">
        <input type="number" class="form-control" id="balance" name="balance">
    </div>
</div>

这个时候这个div是展示不到页面上的

但是当一个条件满足时他才会展示
比如说我那个下拉框选择会员卡时，我添加一个下拉框选项的点击事件

/*添加会员卡储值是否展示*/
$(".selector").click(function () {
    var categoryId=$("#categoryId").val();
    if(categoryId==100){
        $(".selecttor").css("display","block");
    }
    else{
        $(".selecttor").css("display","none");
    }
});

这是个人用的比较多的，希望对各位有所帮助；