Bootstrap数据过滤器和项目组合项目类

Question

我已经下载了一个bootstrap模板，这是用于过滤的代码。我不理解有关相同TAG的投资组合项目类的评论。我看不到我要添加的内容？

<!-- CONTENT CONTAINER-->
    <div class="container">
            <!-- FILTER-->
        <!-- just add your TAG to data-filter="ADD HERE" -->    
        <!-- and then add your same TAG to portfolio item class="ADD HERE" -       ->
        <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                <div class="panel panel-default text-center">
                    <div class="panel-body">
                        <div class="proj">
                            <div id="filters">
                            <a href="#" data-filter="*" class=" active btn   btn-danger">Show All</a>
                            <a href="#" data-filter=".graphics" class="btn  btn-danger">Graphics</a>
                            <a href="#" data-filter=".web" class="btn  btn-danger">Web</a>
                            <a href="#" data-filter=".ui" class="btn  btn-danger">UI</a>
                            <a href="#" data-filter=".design" class="btn  btn-danger">Design</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    <!--END: FILTER-->


<!--###################-->
<!-- START PORTFOLIO -->
<!--###################-->
<div id="container-folio" style="position:relative">

<!-- portfolio item -->
<div class="box col-xs-6 col-md-4 col-sm-6 col-lg-3 graphics design">
    <!-- START WRAPPER IMG THUMBNAIL-->
    <div class="thumbnail">
            <!-- NAV LINKS -->
            <div class="plus">
                    <a href="#" title="read more" class="btn btn-lg btn- info"><i class="icon-link"></i></a>
                    <a href="#" title="enlarge" class="btn btn-lg btn-  primary"><i class="icon-eye-open"></i></a>
            </div>
            <!-- /NAV LINKS -->
        <!-- / IMAGE-->
        <img class="img-responsive"  src="http://lorempixel.com/560/420/fashion/10" alt="">
        <!-- / IMAGE-->

Answer 1

我在我的工作项目中使用过这个模板。这里的解释是：通过数据过滤器将过滤器链接绑定到每个相关项

data-filter=".graphics" 

通过将类名添加到网格列div，将每个项绑定到其过滤器链接：

恩。此项目是图形和设计过滤器的项目

<div class="box col-xs-6 col-md-4 col-sm-6 col-lg-3 graphics design">