Bootstrap blog snippets

Loading…

Bootstrap blog snippets | GoSnippets

Source Code

1<section class="pt-5 pb-5">
2    <div class="container">
3          <div class="row">
4            <div class="col-lg-7 mb-4">
5              <img class="img-fluid rounded mb-3" src="https://via.placeholder.com/730x400/5fa9f8/60a7f3" alt="A guide to building your online presence"><a href="#" class="mt-4 h2 text-dark">How to Inspire and Motivate Your Team...</a>
6<p class="mt-4">Cras in fringilla egestas condimentum morbi ut urna nec nunc.Cras in fringilla egestas condimentum morbi ut urna nec nunc.Cras in fringilla egestas condimentum morbi ut urna nec nunc.Cras in fringilla egestas condimentum morbi ut urna nec nunc.</p>
7
8<div class="d-flex text-small">
9                    <a href="#">Business</a>
10                    <span class="text-muted ms-1">29th November</span>
11                  </div>
12
13            </div>
14            <div class="col-lg-5 ">
15              <ul class="list-unstyled">
16              <li class="row mb-4">
17                <a href="#" class="col-3">
18                  <img src="https://via.placeholder.com/300x300/5fa9f8/ffffff" alt="Image" class="rounded img-fluid">
19                </a>
20                <div class="col-9">
21                  <a href="#">
22                    <h6 class="mb-3 h5 text-dark">Cras in fringilla egestas condimentum morbi ut urna.</h6>
23                  </a>
24                  <div class="d-flex text-small">
25                    <a href="#">Business</a>
26                    <span class="text-muted ms-1">29th November</span>
27                  </div>
28                </div>
29              </li>
30              <li class="row mb-4">
31                <a href="#" class="col-3">
32                  <img src="https://via.placeholder.com/300x300/5fa9f8/ffffff" alt="Image" class="rounded img-fluid">
33                </a>
34                <div class="col-9">
35                  <a href="#">
36                    <h6 class="mb-3 h5 text-dark">How to Inspire and Motivate Your Team...</h6>
37                  </a>
38                  <div class="d-flex text-small">
39                    <a href="#">Design</a>
40                    <span class="text-muted ms-1">27th November</span>
41                  </div>
42                </div>
43              </li>
44              <li class="row mb-4">
45                <a href="#" class="col-3">
46                  <img src="https://via.placeholder.com/300x300/5fa9f8/ffffff" alt="Image" class="rounded img-fluid">
47                </a>
48                <div class="col-9">
49                  <a href="#">
50                    <h6 class="mb-3 text-dark h5">Securing your Series A</h6>
51                  </a>
52                  <div class="d-flex text-small">
53                    <a href="#">Business</a>
54                    <span class="text-muted ms-1">23rd November</span>
55                  </div>
56                </div>
57              </li>
58<li class="row mb-4">
59                <a href="#" class="col-3">
60                  <img src="https://via.placeholder.com/300x300/5fa9f8/ffffff" alt="Image" class="rounded img-fluid">
61                </a>
62                <div class="col-9">
63                  <a href="#">
64                    <h6 class="mb-3 h5 text-dark">Cras in fringilla egestas condimentum morbi ut urna.</h6>
65                  </a>
66                  <div class="d-flex text-small">
67                    <a href="#">Business</a>
68                    <span class="text-muted ms-1">29th November</span>
69                  </div>
70                </div>
71              </li><li class="row mb-4">
72                <a href="#" class="col-3">
73                  <img src="https://via.placeholder.com/300x300/5fa9f8/ffffff" alt="Image" class="rounded img-fluid">
74                </a>
75                <div class="col-9">
76                  <a href="#">
77                    <h6 class="mb-3 h5 text-dark">Cras in fringilla egestas condimentum morbi ut urna.</h6>
78                  </a>
79                  <div class="d-flex text-small">
80                    <a href="#">Business</a>
81                    <span class="text-muted ms-1">29th November</span>
82                  </div>
83                </div>
84              </li>
85            </ul>
86            </div>
87          </div>
88        </div>
89      </section>

Bootstrap blog snippets

Source Code

More Utilities snippets

Comments(0)