Cara Menyembunyikan Teks Dengan Css

Published by Concept Phone Selasa, 13 Maret 2018

Ada banyak Cara Menyembunyikan Teks dengan CSS, berikut ini beberapa arahan CSS yang dapat Anda gunakan untuk menyembunyikan suatu teks di dalam markup tertentu hanya dengan memakai 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, agar para pembaca terbantu dengan goresan pena dari ini.