"card , post , item"
Bootstrap 4.0.0 Snippet by mhk67_

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <section class="container-fluid news-sec"> <div class="container"> <div class="row"> <div class="col"> <h2>اخبار و اطلاعیه ها</h2> </div><!--.col--> </div><!--.row--> <div class="row"> <div class="col-md-6"> <div class="card"> <div class="card-body"> <span class="badge badge-success p-2">20 فروردین 1397</span> <h5 class="card-title"><a href="#" class="card-link">جلسه نهم آموزش خانواده</a></h5> <h6 class="card-subtitle mb-2 text-muted">به گزارش روابط عمومی سایت مجتمع تربیتی آموزشی ، نهمین جلسه آموزش خانواده یک شنبه مورخ ٢٩ بهمن ٩۶ در ...</h6> </div> </div> </div><!--.col--> <div class="col-md-6"> <div class="card"> <div class="card-body"> <span class="badge badge-success p-2">20 فروردین 1397</span> <h5 class="card-title"><a href="#" class="card-link">جلسه نهم آموزش خانواده</a></h5> <h6 class="card-subtitle mb-2 text-muted">به گزارش روابط عمومی سایت مجتمع تربیتی آموزشی ، نهمین جلسه آموزش خانواده یک شنبه مورخ ٢٩ بهمن ٩۶ در ...</h6> </div> </div> </div><!--.col--> <div class="col-md-6"> <div class="card"> <div class="card-body"> <span class="badge badge-success p-2">20 فروردین 1397</span> <h5 class="card-title"><a href="#" class="card-link">جلسه نهم آموزش خانواده</a></h5> <h6 class="card-subtitle mb-2 text-muted">به گزارش روابط عمومی سایت مجتمع تربیتی آموزشی ، نهمین جلسه آموزش خانواده یک شنبه مورخ ٢٩ بهمن ٩۶ در ...</h6> </div> </div> </div><!--.col--> <div class="col-md-6"> <div class="card"> <div class="card-body"> <span class="badge badge-success p-2">20 فروردین 1397</span> <h5 class="card-title"><a href="#" class="card-link">جلسه نهم آموزش خانواده</a></h5> <h6 class="card-subtitle mb-2 text-muted">به گزارش روابط عمومی سایت مجتمع تربیتی آموزشی ، نهمین جلسه آموزش خانواده یک شنبه مورخ ٢٩ بهمن ٩۶ در ...</h6> </div> </div> </div><!--.col--> </div><!--.row--> <div class="row"> <div class="col text-left"> <a href="#" class="text-danger small">مشاهده تمام اخبار</a> </div> </div> </div><!--.container--> </section>
.news-sec{ direction: rtl; text-align: right; padding-top: 2.5rem; background: #fafafa; } .news-sec .card{ background: none; border: none; } .news-sec .card .badge{ font-size:0.8rem; margin-bottom:1.2rem; background: #87c66d !important; } .news-sec .card a.card-link{ color: #000 !important; }

Related: See More


Questions / Comments: