Cara Menyembunyikan Teks dengan CSS

Cara Menyembunyikan Teks dengan CSS

Posted by Pace USA Gans

Wednesday, April 29, 2020

CSS Seo

Ada banyak Cara Menyembunyikan Teks dengan CSS, berikut ini beberapa kode CSS yang bisa Anda gunakan untuk menyembunyikan suatu teks di dalam markup tertentu hanya dengan menggunakan CSS.

Cara 1

.hide-text {
overflow: hidden;
text-indent: 100%;
white-space: nowrap;
}

Cara 2

.hide-text{
position: absolute;
top: -9999px;
left: -9999px;
}

Cara 3

.hide-text {
text-indent: -9999em;
outline: 0;
}

.hide-text {
height: 0;
overflow: hidden;
position: absolute;
}

.hide-text {
position: absolute;
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
width: 1px;
overflow: hidden;
}

Cara 4 : Pada tombol

.submitbutton {
display:block;
width:100px; height:25px;
background-image:url(image.jpg); background-repeat:no-repeat;
text-indent:-999px;
font-size:0px; line-height:0;
}

Cara 5 : Mengganti teks header dengan gambar

h1 {
text-indent:-9999px;
margin:0 auto;
width:400px;
height:100px;
background:transparent url("images/logo.jpg") no-repeat scroll;
}

Demikian beberapa trik Cara Menyembunyikan Teks dengan CSS, semoga para pembaca terbantu dengan tulisan dari Blog ini.

Cara Menyembunyikan Teks dengan CSS

4/ 5

Oleh Pace USA Gans

Ditulis Pace USA Gans Pada April 29, 2020 Komentar