:text Seçicisi;
type = text tipi giriş elementlerini seçmek için kullanılır.
Örnek
$(":text").css("background-color", "blue");
Codepen Ön izleme
Kullanım şekilleri;
$(“:text”)
type = text tipi giriş elementlerini seçmek için kullanılır.
$(":text").css("background-color", "blue");
$(“:text”)
text() yöntemi eşleştiği elementlerin metin içeriğini almak veya onları değiştirmek için kullanılır.
$("a").click(function(){
$("span").text("HOŞGELDİNİZ");
});
.text()
.text(content)
.text( text )
.text( function )
Metinin harflerinin büyütülmesi veya küçültülmesi için kullanılır.
.uppercase{
text-transform: uppercase;
}
.lowercase{
text-transform:lowercase;
}
.capitalize {
text-transform:capitalize;
}
| Değer | Açıklama |
| none | Hiçbir değişiklik yapmaz. |
| capitalize | Sadece baş harfleri büyük yapar. |
| uppercase | Bütün harfleri büyük yapar. |
| lowercase | Bütün harfleri küçük yapar. |
| İnital | |
| İnherit |
| 1.0 | 1.0 | 4.0 | 1.0 | 7.0 |
Metinlere gölge eklemek için kullanılır.
p {
text-align: center;
font-size: 50px;
text-shadow: 5px 5px green;
}
| Değer | Açıklama |
| none | Hiçbir gölge vermez. |
| h-shadow | zorunlu, Yatay gölge konumu belirtmek için kullanılır. Negatif değerler alabilir. |
| v-shadow | zorunlu, Dikey gölge konumu belirtmek için kullanılır. Negatif değerler alabilir. |
| Blur-radius | isteğe bağlı, Gölgenin bulanıklığını ayarlamak için kullanılır. Varsayılan değer:0. |
| color | isteğe bağlı, Gölgenin rengini ayarlamak için kullanılır. |
| İnital | |
| İnherit |
| 4.0 | 3.5 | 10.0 | 4.0 | 9.6 |
Taşan metnin gizlendiğini kullanıcıya belirtmek için kullanılır.
p {
white-space: nowrap;
width: 500px;
overflow: hidden;
text-overflow: ellipsis;
border : 1px solid red;
padding: 40px;
}
| Değer | Açıklama |
| clip | Metnin taşan kısmını keser. |
| ellipsis | Metnin taşan kısmından itibaren üç nokta koyar. |
| string | |
| İnital | |
| İnherit |
| 4.0 | 7.0 | 6.0 | 3.1 | 11.0 9.0-o |
Metini iki yana yaslamak için kullanılır.
p{
text-align: justify;
text-justify: inter-word;
}
| Değer | Açıklama |
| auto | Metin tarayıcıya göre otomatik olarak ayarlanır. |
| İnter-word | Sözcükler arası boşluğu artırmak veya azaltmak için kullanılır. |
| İnter-ideograph | İçerik özel metin(ideografik)le iki yana yaslanır. |
| İnter-cluster | |
| distribute | Harfler ve sözcükler arasındaki mesafeyi artırmak veya azaltmak için kullanılır. |
| kashida | |
| trim | |
| İnital | |
| İnherit |
| Desteklenmiyor | Desteklenmiyor | 5.5 | Desteklenmiyor | Desteklenmiyor |
Paragrafın girintisini ayarlamak için kullanılır.
p{
text-indent: 100px;
}
| Değer | Açıklama |
| length | Yüzdeli, px, em, cm gibi değerler alabilir. |
| İnital | |
| İnherit |
| 1.0 | 1.0 | 3.0 | 1.0 | 3.5 |
Eklenecek çizginin stilini belirlemek için kullanılır.
p{
-moz-text-decoration-style: dashed; /*Firefox */
text-decoration: overline;
}
| Değer | Açıklama |
| solid | Çizgi tek bir satır şeklinde görünür. |
| double | Kalın tek bir çizgi görünür. |
| dotted | Çizgi noktalı bir şekilde görünür. |
| wavy | Çizgi dalgalı bir şekilde görünür. |
| dashed | izgi kesik çizgili şeklinde görünür. |
| İnital | |
| İnherit |
| Desteklenmiyor | 6.0-moz | Desteklenmiyor | Desteklenmiyor | Desteklenmiyor |
Çizgi eklemek veya kaldırmak için kullanılır.
Not: text-decoration-line özeliklerini text-decoration-line, text-decoration-style ve the text-decoration-color özelliklerini kullanarakda ayarlayabilirsiniz. Ayrıca overline ve underline satır altında veya metnin üstünde gösterebilmek için birden fazla değeri birleştirebilirsiniz.
p{
-moz-text-decoration-line: underline; /* Code for Firefox */
text-decoration-line: underline;
}
| Değer | Açıklama |
| none | Hiç bir çizgi eklemez. |
| underline | Metinin altını çizmek için kullanılır. |
| overline | Metinin üstünü çizmek için kullanılır. |
| Line-through | Metinin üzerini çizmek için kullanılır. |
| İnital | |
| İnherit |
| Desteklenmiyor | 6.0-moz | Desteklenmiyor | Desteklenmiyor | Desteklenmiyor |
Metinlere eklediğimiz dekorasyon özelliklerini rengini belirlemek için kullanılır.
Not: text-decoration-color özelliği sadece text-decoration özelliği ile beraber kullanılırsa görünür olur. Aksi takdirde görünmez.
p{
text-decoration: overline;
-moz-text-decoration-color: green; /*Firefox */
text-decoration-color: green;
}
| Değer | Açıklama |
| color | Dekorasyon özelliğinin rengini belirlemek için kullanılır. |
| İnital | |
| İnherit |
| Desteklenmiyor | 6.0-moz | Desteklenmiyor | Desteklenmiyor | Desteklenmiyor |