• SDN Forum üyelikleri çok yakında yeniden açılıyor. Siz de bu büyük topluluğun bir parçası olmak için bizi takipte kalın, gelişmeleri kaçırmayın!

<span>...</span> komutunda sorun var?

  • Konuyu başlatan Konuyu başlatan Zee
  • Başlangıç tarihi Başlangıç tarihi

Zee

Asistan
Katılım
8 Nisan 2010
Mesajlar
446
Tepki puanı
4
Puanları
18
Bir class açtım <p>...</p> ve <span>...</span> komutlarınıda aynı sınıfa aktardım fakat span'da center komutu işlemiyor? Span 'nın ne işe yaraıdğını ve neden text-align:center; komutunun işlemediğini anlatabilir mi?

---------------------------------------------------------------------------------------------------------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-*****="Content-Type" **********text/html; charset=utf-8" />
<title>Untitled Document</title>

<style type="text/css">

.baslık {
font-size:24px;
font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
color:#000;
text-align:center;
}



</style>


</head>

<body>


<p class="baslık"> Deneme </p>

<span class="baslık"> denemeolmuyor </span>

</body>
</html>
 
HTML <SPAN> etiketi, isteğe bağlı verilerin gösterilmesi için yapısal ve görsel bir katman oluşturulmasını sağlar.SPAN, DIV etiketinden farklı olarak bir satır içi (inline) element olduğu için metnin içinde kullanılması durumunda ilgili metni kesmez.

Kod:
<p>denemeolmuyor= <span style="font-style:normal; color:navy; text-align:center;">denemeolmuyor</span></p>

Şu şekilde deniyebilirmisniz.
 
Denedim... dreamweawerde yazıyorum. Fakat spanda ortalamayı yapamadım olmuyor yani.. span ne için kullanılıyor?
 
Merhaba, <span> </span> tagı tek başına <p> tagı ile kullanımlarda çok fazla işlevi olmamaktadır. Fakat span tagını JavaScript ve Jquery kütüphanesi ile onclick,ondblclick,onmousedown... vb fonksiyonlar ile kullanabilirsiniz. Eğer CSS için kullanacaksanız <p> tagını kullanmak sizin için daha kolay olacaktır.

İyi çalışmalar...
 
span varsailan olarak inline bir lemettir bu yuzden text align komutu etki etmez. .baslik css kodunun icine display:block seklinde bir kod ekleyin. Bu buyuk ihtimalle cozecektir. Ama gorunumu istediginiz gibi olmayabilir. Spanin ne ise yaradigi konusunda bir cevap gelmis sanirim...
 
boşver spanı <div></div> kullan. Birde css de türkçe karakter kullanmışsın, -» .baslık {
 
Merhaba, <span> </span> tagı tek başına <p> tagı ile kullanımlarda çok fazla işlevi olmamaktadır. Fakat span tagını JavaScript ve Jquery kütüphanesi ile onclick,ondblclick,onmousedown... vb fonksiyonlar ile kullanabilirsiniz. Eğer CSS için kullanacaksanız <p> tagını kullanmak sizin için daha kolay olacaktır.

İyi çalışmalar...



Span, arkadaşların dediği gibi inline(satır içi) elementtir. Sadece arasındaki veriyi ortamdan farklı kılmak için kullanılır. Örnek: Uzun yazılarda vurgu yapmak.
"SPAN" yerine "P" tagı kullanırsanız satır başı paragraf yapacaktır (Özelleştirilmediği durumlarda).

Örnek olarak,
"Lorem Ipsum, <span style="color:red;">dizgi</span> ve <span style="color:blue; font-size:16px;">baskı</span> endüstrisinde kullanılan mıgır metinlerdir. Lorem Ipsum, adı bilinmeyen bir matbaacının bir hurufat numune kitabı oluşturmak üzere bir yazı galerisini alarak karıştırdığı <span style="color:green; font-size:20px; font-weght:bold; background-color:#f00;">1500</span>'lerden beri endüstri standardı sahte metinler olarak kullanılmıştır."

Ekran çıktısı,
"Lorem Ipsum, dizgi ve baskı endüstrisinde kullanılan mıgır metinlerdir. Lorem Ipsum, adı bilinmeyen bir matbaacının bir hurufat numune kitabı oluşturmak üzere bir yazı galerisini alarak karıştırdığı 1500'lerden beri endüstri standardı sahte metinler olarak kullanılmıştır." şeklinde olacaktır.

Span sadece içerisindeki veri kadar alan tutar. Bu yüzden ortalayamamaktasınız. Bu elemente "width" verseniz dahi bu özelliği almayacaktır.
Eğer siz "SPAN" tagını özelleştirip(css) ortalamak isterseniz "display" özelliğini "block" veya "inline-block" yapmak zorundasınız.

Örnek olarak,
"Lorem Ipsum, <span style="color:red; ">dizgi</span> ve <span style="color:blue; font-size:16px;">baskı</span> endüstrisinde kullanılan mıgır metinlerdir. Lorem Ipsum, adı bilinmeyen bir matbaacının bir hurufat numune kitabı oluşturmak üzere bir yazı galerisini alarak karıştırdığı <span style="color:green; font-size:20px; font-weght:bold; background-color:#f00; width:300px; text-align:center;">1500</span>'lerden beri endüstri standardı sahte metinler olarak kullanılmıştır."

Ekran çıktısı,
"Lorem Ipsum, dizgi ve baskı endüstrisinde kullanılan mıgır metinlerdir. Lorem Ipsum, adı bilinmeyen bir matbaacının bir hurufat numune kitabı oluşturmak üzere bir yazı galerisini alarak karıştırdığı
1500
'lerden beri endüstri standardı sahte metinler olarak kullanılmıştır."

Örnek olarak,
"Lorem Ipsum, <span style="color:red; ">dizgi</span> ve <span style="color:blue; font-size:16px;">baskı</span> endüstrisinde kullanılan mıgır metinlerdir. Lorem Ipsum, adı bilinmeyen bir matbaacının bir hurufat numune kitabı oluşturmak üzere bir yazı galerisini alarak karıştırdığı <span style="color:green; font-size:20px; font-weght:bold; background-color:#f00; width:300px; display:inline-block; text-align:center;">1500</span>'lerden beri endüstri standardı sahte metinler olarak kullanılmıştır."

Ekran çıktısı,
"Lorem Ipsum, dizgi ve baskı endüstrisinde kullanılan mıgır metinlerdir. Lorem Ipsum, adı bilinmeyen bir matbaacının bir hurufat numune kitabı oluşturmak üzere bir yazı galerisini alarak karıştırdığı
1500
'lerden beri endüstri standardı sahte metinler olarak kullanılmıştır."


Düzeltme:
Ekran çıktılarını yazarken gerçeği ile özleşteştiremedim. Kodları deneyerek sonuca ulaşabilirsin.
İyi çalışmalar.
 
Üst