Cara Menyembunyikan Teks dengan CSS - Arlina Design
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 Menyembunyikan Teks Dengan 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 Arlina Design ini.

Cara Menyembunyikan Teks dengan CSS

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 Menyembunyikan Teks Dengan 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 Arlina Design ini.

Related Post

Disqus Codes
  • To write a bold letter please use <strong></strong> or <b></b>
  • To write a italic letter please use <em></em> or <i></i>
  • To write a underline letter please use <u></u>
  • To write a strikethrought letter please use <strike></strike>
  • To write HTML code, please use <code></code> or <pre></pre> or <pre><code></code></pre>
    And use parse tool below to easy get the style.
Show Parser Box

strong em u strike
pre code pre code spoiler
embed

Subscribe Our Newsletter

Notifications

Disqus Logo