bootstrap-响应式工具和打印样式


响应式工具:

<div class="container">
    <!--
        针对不同的宽度 展示或隐藏相关内容
        visible-lg-block            显示
        hidden-lg                    隐藏
     -->
    <div class="row">
        <div class="col-lg-4 visible-lg-block">1</div>
        <div class="col-lg-4 visible-lg-inline">2</div>
        <div class="col-lg-4 visible-lg-inline-block">3</div>
    </div>

    <div class="row">
        <div class="col-lg-4 hidden-lg">4</div>
    </div>
</div>

打印样式:

<div class="container">
    <!--
        visible-print-block:        只有在打印的时候显示
        hidden-print                打印的时候不显示
     -->
    <div class="row">
        <div class="col-lg-3 visible-print-block">1</div>
        <div class="col-lg-3 visible-print-inline">2</div>
        <div class="col-lg-3 visible-print-inline-block">3</div>
        <div class="col-lg-3 hidden-print">4</div>
    </div>
</div>

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM