"Untitled"
Bulma 0.7.1 Snippet by ezekiel33

Post to Facebook Tweet this

<link href="//cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.min.css" rel="stylesheet" id="bootstrap-css"> <script src=""></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>My custom Bulma website</title> <link rel="stylesheet" href="css/mystyles.css" /> </head> <body> <section class="container"> <div class="navbar"> <div class="navbar-brand"> <div class="navbar-item">NewsExplorer</div> <div class="burger-menu"> <img src="./img/menu.svg" alt="" /> </div> <div class="navbar"> <div class="navbar-end"> <ul class="navbar-item"> <li>Главная</li> <li>Сохраненные статьи</li> </ul> </div> <button class="button"> <p>Грета</p> <img src="./img/logout.svg" alt="" /> </button> </div> </div> </div> </section> <section class="promo"> <div class="container"> <div> <p class="saved">Сохранённые статьи</p> <h1 class="header">Грета, у вас 5 сохранённых статей</h1> <p class="keywords"> По ключевым словам: <strong>Природа, Тайга</strong> и <strong>2-м другим</strong> </p> </div> </div> </section> <section class="news"> <div class="container"> <div class="cards"> <div class="card"> <img src="./img/image-card-1.jpg" alt="" /> <div class="btn-active-flex"> <div class="card-keyword">Природа</div> <div class="btn-active-flex-inner"> <div class="card-trash"> <img src="./img/trash.svg" alt="Удалить" /> </div> </div> </div> <div class="text"> <p class="date">2 августа, 2019</p> <h2 class="card-title">Национальное достояние – парки</h2> <p class="card-text"> В 2016 году Америка отмечала важный юбилей: сто лет назад здесь начала складываться система национальных парков – охраняемых территорий, где и сегодня каждый может приобщиться к природе. </p> <p class="card-source">Дзен</p> </div> </div> <div class="card"> <img src="./img/image-card-2.jpg" alt="" /> <div class="btn-active-flex"> <div class="card-keyword">Природа</div> <div class="btn-active-flex-inner"> <div class="remove-saved">Убрать из сохраненных</div> <div class="card-trash"> <img src="./img/trash.svg" alt="Удалить" /> </div> </div> </div> <div class="text"> <p class="date">2 августа, 2019</p> <h2 class="card-title">Национальное достояние – парки</h2> <p class="card-text"> В 2016 году Америка отмечала важный юбилей: сто лет назад здесь начала складываться система национальных парков – охраняемых территорий, где и сегодня каждый может приобщиться к природе. </p> <p class="card-source">Дзен</p> </div> </div> <div class="card"> <img src="./img/image-card-3.jpg" alt="" /> <div class="btn-active-flex"> <div class="card-keyword">Природа</div> <div class="btn-active-flex-inner"> <div class="card-trash"> <img src="./img/trash.svg" alt="Удалить" /> </div> </div> </div> <div class="text"> <p class="date">2 августа, 2019</p> <h2 class="card-title">Национальное достояние – парки</h2> <p class="card-text"> В 2016 году Америка отмечала важный юбилей: сто лет назад здесь начала складываться система национальных парков – охраняемых территорий, где и сегодня каждый может приобщиться к природе. </p> <p class="card-source">Дзен</p> </div> </div> <div class="card"> <img src="./img/image-card-1.jpg" alt="" /> <div class="btn-active-flex"> <div class="card-keyword">Природа</div> <div class="btn-active-flex-inner"> <div class="card-trash"> <img src="./img/trash.svg" alt="Удалить" /> </div> </div> </div> <div class="text"> <p class="date">2 августа, 2019</p> <h2 class="card-title">Национальное достояние – парки</h2> <p class="card-text"> В 2016 году Америка отмечала важный юбилей: сто лет назад здесь начала складываться система национальных парков – охраняемых территорий, где и сегодня каждый может приобщиться к природе. </p> <p class="card-source">Дзен</p> </div> </div> <div class="card"> <img src="./img/image-card-2.jpg" alt="" /> <div class="btn-active-flex"> <div class="card-keyword">Природа</div> <div class="btn-active-flex-inner"> <div class="card-trash"> <img src="./img/trash.svg" alt="Удалить" /> </div> </div> </div> <div class="text"> <p class="date">2 августа, 2019</p> <h2 class="card-title">Национальное достояние – парки</h2> <p class="card-text"> В 2016 году Америка отмечала важный юбилей: сто лет назад здесь начала складываться система национальных парков – охраняемых территорий, где и сегодня каждый может приобщиться к природе. </p> <p class="card-source">Дзен</p> </div> </div> </div> </div> </section> <footer class="desktop"> <div class="container"> <div class="footer-content"> <div class="copyright">© 2020 Supersite, Powered by News API</div> <div class="footer-menu"> <div class="menu"> <ul class="footer-list"> <li>Главная</li> <li>Яндекс.Практикум</li> <li><img src="./img/github.svg" alt="" /></li> <li><img src="./img/facebook.svg" alt="" /></li> </ul> </div> </div> </div> </div> </footer> <footer class="mobile"> <div class="container"> <div class="flexFooter"> <div class="footerText">© 2020 Supersite, Powered by News API</div> <div class="textAndIconsFlex"> <nav class="footerMenu"> <div class="mainFooter">Главная</div> <div class="yaProfi">Яндекс.Практикум</div> </nav> <div class="iconsFooter"> <img class="icon1" alt="icon" src="./img/github.svg" /> <img alt="icon" src="./img/facebook.svg" /> </div> </div> </div> </div> </footer> </body> </html>

Related: See More

Material Dashboard Pro BS3

Questions / Comments: