Cara Membuat Tanda Pada Teks Selain Menggunakan Tag Mark
Apa yang di maksud dengan tanda, jadi seperti ini, pernahkan teman-teman memberikan tanda di suatu buku, dimana biasannya saya memberikan tanda di suatu kata yang menurut saya itu urgen, dan dengan tag mark kita dapat memberikan efek seperti itu, telah dapat membayangkan ya, jadi tulisan itu akan ada efek seperti ada backgroundnya, biasanya warnanya kuning pudar, oke tetapi disini kita akan belajar cara merancang tanda di teks selain menggunakan tag mark. oke jangan kemana-mana simak terus ya teman-teman.
Disini dengan judul cara merancang tanda di teks selain menggunakan tag mark, saya masih menggunakan theme yang sama ya, seperti sebelumnya biar menghemat waktu, oke lalu selain dengan menggunakan tag mark dengan cara apa ? di bootstrap 4 terdapat tag yang fungsinya hampir sama denga tag mark, tapi warnannya lebih tebal kehitaman ya teman-teman, dengna tag <kbd>, kita dapat merancang kegunaan seperti tag mark, lagi-lagi di bootstrap 4 membawa tag yang hampir sering di gunakan ya, oke seketika saja bagaimana cara membuatanya:
<!DOCTYPE html>
<html>
<head>
<title>Cara Membangun Tanda Di Teks Selain Menggunakan Tag Mark</title>
<link rel=shortcut icon type=image/x-icon href=oktober/favicon.ico>
<link rel=stylesheet href=https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css>
<-e-script src=https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js></script>
<-e-script src=https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.6/umd/popper.min.js></script>
<-e-script src=https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js></script>
<-e-style type=text/css>
*{padding: 0; margin: 0}
body{
background-color: #6EDAF8;
}
.grid-container {
display: grid;
grid-template-columns: auto auto auto;
grid-gap: 10px;
background-color: #2196F3;
padding: 10px;
}
.grid-container>div {
background-color: rgba(255, 255, 255, 0.8);
text-align: center;
padding:20px 0;
font-size: 30px;
}
.item2 {
grid-row-end:span 3;
}
.container{
width: 800px;
margin: auto;
background: #fff;
overflow: hidden;
}
</style>
</head>
<body>
<div class=container>
<h1>Cara Membangun Tanda Di Teks Selain Menggunakan Tag Mark</h1>
<div class=grid-container>
<div class=item1>1</div>
<div class=item2>2</div>
<div class=item3>3</div>
<div class=item4>4</div>
<div class=item5>5</div>
<div class=item6>6</div>
<div class=item7>7</div>
</div>
<p>Jadi seandainya kita lihat di atas saya merancang contoh ketika kita tak menggunakan colspan dan rowspan bagi menggabungkan sebuah kolom dan baris, tapi menggunakan grid row end</p>
<!-- FOKUS KESINI -->
<p>gunakan <kbd>ctrl + p</kbd> bagi mencetak hasilnya atau kita <mark>Print</mark> contoh di atas.</p>
</div>
</body>
</html>
Seandainya kita lihat hampir sama ya caranya bahwa tag kbd, yaitu tag yang berpasangan, jadi di pada situ kita dapat memberikan tulisan didalamnya dimana tulisan itu akan menimbulkan efek seperti ada background hitam, oke seperti apa hasilnya seperti inilah:
Oke dapat dilihat ya, efek yang diberikan di tag kbd tebal, dan disampingnya mark agak sedikit orange pudar ya, oke seperti ini lah hasil dari tag kbd atau cara merancang tanda di teks selain menggunakan tag mark, semoga bermanfaat dan hingga jumpa di artikel berikutnya terimakasih.
Sumber https://kursuswebsite.org
