Pernahkah anda berfikiran menandai teks yang penting di halaman website anda ? apa lagi website anda itu termasuk website artikel dimana pasti ada kata penting di sebuah artikelnya, dan anda pasti berfikir bagaimana caranya supaya kita memberitahu kepada pembaca bahwa teks itu adalah teks yang penting, bisa saja hal yang harus pembaca ingat, dengan bootstrap kita bisa menandai teks itu, oke bagaimana cara menandai teks yang penting di website dengan bootstrap jangan kemana-mana ya teman-teman.
Kalo saya melihat judulnya saya jadi ingat waktu masih sekolah dulu, dimana jika ada kata penting yang terdapat pada buku, saya menandainya dengan stabilo, seperti ini lah yang nanti kita akan buat, jadi teks itu kita beri warna lebih tepatnya backgroundnya ya temna-teman. Disini kita masih menggunakan tampilan website yang kemarin kita buat, jadi biar kita gak makan banyak waktu lagi, supaya langsung masuk dalam contoh pembuatannya. Seperti inilah cara menandai teks yang penting di website dengan bootstrap:
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Cara menandai teks yang penting di website dengan bootstrap </title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12">
<h1>Cara menandai teks yang penting di website dengan bootstrap</h1>
<div class="row">
<div class="col-md-6">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's <span class="d-block bg-warning"> standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book</span> . It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</div>
<div class="col-md-6">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy <span class="d-block bg-success"> text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</span> It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</div>
</div>
<div class="bg-info clearfix ">
<button class="btn btn-secondary float-left">Sebelumnya</button>
<button class="btn btn-secondary float-right">Selanjutnya</button>
</div>
<p>Jika tidak ada <b class="d-inline bg-primary">class clearfix</b> tulisan ini akan naik keatas, berada di tengah-tengah tombol button</p>
</div>
</div>
</div>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<-e-script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"><-e-/script>
<-e-script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"><-e-/script>
<-e-script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"><-e-/script>
</body>
</html>
“Hapus tanda -e- ”
Disini saya memberikan pada teks dan pada penanda di bawah ya teman-teman oke saya rasa cukup sampai disini belajar kita tentang cara menandai teks yang penting di website dengan bootstrap, semoga bermanfaat dan sampai jumpa.
