en çok kullanılan css kodları arşivleri - Serdar Sezer https://www.serdarsezer.com/tag/en-cok-kullanilan-css-kodlari/ Serdar Sezer'in Kişisel Web Sitesi Fri, 21 Jun 2019 07:52:13 +0000 tr hourly 1 https://wordpress.org/?v=6.7.1 https://www.serdarsezer.com/wp-content/uploads/2015/10/cropped-serdar-sezer32-32x32.jpg en çok kullanılan css kodları arşivleri - Serdar Sezer https://www.serdarsezer.com/tag/en-cok-kullanilan-css-kodlari/ 32 32 EN ÇOK KULLANILAN CSS STİLLERİ https://www.serdarsezer.com/css-stilleri-ozelikleri/ https://www.serdarsezer.com/css-stilleri-ozelikleri/#respond Mon, 29 Apr 2019 15:17:01 +0000 http://www.serdarsezer.com/?p=1469 Arka Plan Stilleri background–color Arka plan rengini belirler, renk ismi veya renk kodu girilir. background-image Arka plan resmi için kullanılır. background-image: url(images/bg.jpg); background-repeat Arka plan resminin hangi yönlerde döşenerek tekrarlanacağı. Repeat-x, repeat-y, no-repeat, repeat background-position Arka plan resminin sayfa içinde döşenmeye, nereden başlanacağı. Center center, top center gibi… background-attachment Arkaplan resminin sayfayla birlikte nasıl hareket...

EN ÇOK KULLANILAN CSS STİLLERİ yazısı ilk önce Serdar Sezer üzerinde ortaya çıktı.

]]> Arka Plan Stilleri background–color Arka plan rengini belirler, renk ismi veya renk kodu girilir. background-image Arka plan resmi için kullanılır.

background-image: url(images/bg.jpg); background-repeat Arka plan resminin hangi yönlerde döşenerek tekrarlanacağı.

Repeat-x, repeat-y, no-repeat, repeat background-position Arka plan resminin sayfa içinde döşenmeye, nereden başlanacağı. Center center, top center gibi… background-attachment Arkaplan resminin sayfayla birlikte nasıl hareket edeceği. Fixed yaparsak sabitlenir ve sayfa kaysa da resim kaymaz.

 

Font ve Metin Stilleri
color Metin rengini belirler. Renk adı veya renk kodu girilir.

color: red;

color: #999;

color: rgb(255, 255, 255);
font-family Yazı tipini belirler.

font-family: Arial;
font–size Yazı boyutunu (px,  pt, em) belirler.

font-size: 10pt;
font-weight Yazı kalın veya normal yapılabilir. bold, normal…
font-style Yazı italik veya normal yapılabilir. italic, normal…
line-height Satırlar arası mesafeyi belirler. 10 px gibi…
text-align Metin yatay hizalamasını belirler (left, right, center)
text-decoration Metnin altına, üstüne veya üzerine çizgi çizer.

underline altı çizili yapmak için, none çizgiyi kaldırmak için
text-indent İlk satır girintisini ayarlar.

text-indent:15px;
letter-spacing Karakterler arası boşluğu ayarlar.

letter-spacing: 5px;
word-spacing Kelimeler arası boşluğu ayarlar.
vertical-align Dikey hizalamayı ayarlar.

 

İç Alan ve Dış Alan Boşluk Stilleri
margin margin (kenar dışı boşluğu).

margin:5px;

Bu şekilde kullandığımızda tüm yönlerden aynı miktarda boşluk bırakılır. Sadece altan, üstten, soldan veya sağdan boşluk ayarlamak istersek aşağıdaki gibi kullanabiliriz:

margin-top (üst kenar dışı boşluğu)

margin-right (sağ kenar dışı boşluğu)

margin-bottom (alt kenar dışı boşluğu)

margin-left (sol kenar dışı boşluğu)
padding padding (kenar içi boşluğu).

padding: 5px;

Bu şekilde kullandığımızda tüm yönlerden aynı miktarda boşluk bırakılır. Sadece altan, üstten, soldan veya sağdan boşluk ayarlamak istersek aşağıdaki gibi kullanabiliriz:

padding-top (üst kenar içi boşluğu)

padding -right (sağ kenar içi boşluğu)

padding -bottom (alt kenar içi boşluğu)

padding -left (sol kenar içi boşluğu)

 

Kenarlık Stilleri
border-style Kenarlık stilini ayarlaryabiliriz. Solid, dotted, dashed gibi. Sadece sol, sağ, alt veya üst kenarlık stilini ayarlamak istersek aşağıdaki özellikleri kullanabiliriz:

border-top-style

border-right-style

border-bottom-style

border-left-style
border-width Kenarlık kalınlığını ayarlayabiliriz. Sadece sol, sağ, alt veya üst kenarlık kalınlığını ayarlamak istersek aşağıdaki özellikleri kullanabiliriz:

border-top-width

border-right-width

border-bottom-width

border-left-width
border-color Kenarlık rengini ayarlayabiliriz. Sadece sol, sağ, alt veya üst kenarlık kalınlığını ayarlamak istersek aşağıdaki özellikleri kullanabiliriz:

border-top-color

border-right-color

border-bottom-color

border-left-color
border border: 2px dotted #022163;

şeklinde bir kullanım ile kenarlığın hem kalınlığı, hem stili, hem de rengi tek satırda belirlenebilir.
border-collapse Border-collapse:collapse;

şeklinde kullanarak, hücrelerin kendi çizgileri kaldırılabilir. Yani tablo kenarlıkları iki çizgi yerine tek çizgiden oluşur.

 

 Yerleşim Stilleri
Float Özellikle div elemanları için kullanılır. Div elemanları normalde alt alta yerleşirler. Float özelliklerini “left, right” şeklinde ayarlayarak istediğimiz gibi yerleştirebiliriz.

Float:left;

Float:right;
Clear Uygulandığı div elemanı ve arkasından gelecek div elemanlarının, normal şekilde yerleşime devam etmelerini, önceki divlere uygulanmış float özelliklerinden etkilenmemelerini sağlar. Bunun için clear özelliği şu şekilde kullanılır:

Clear:both;
Display Html etiketleri inline ve blok elemanlar olmak üzere ikiye ayrılırlar. Blok elemanlar sayfa içerisinde alt alta yerleşirler. Yani o elemandan sonraki etiketler alt satırdan devam ederler. Örneğin table, h1, p, div gibi etiketlerden sonra alt satıra geçilir.

İnline elemanlar ise satır içinde yerleştirilirler. Örneğin b, i, u, a, font gibi etiketler, aynı satırdan yerleşime devam ederler. İstenilen etiketlerin bu özellikleri şu şekilde değiştirilebilir:

display:block;

display:inline ;

 

Listeleme Stilleri
List-style-type Ol veya ul ile oluşturulan listelerde, satır başlarındaki numara ya da işareti belirlemek için kullanırız. Örneğin büyük roma rakamlarını kullanmak istersek:

ul { List-style-type:upper-roman; }

None değeri verilerek madde işareti kaldırılabilir.
List-style-image ul etiketi ile oluşturduğumuz madde işaretli listelerde, satır başına işaret yerine belirttiğimiz bir resmi koymak istersek, bu özelliği kullanabiliriz:

ul { List-style-image:url(işaret.jpg); }

EN ÇOK KULLANILAN CSS STİLLERİ yazısı ilk önce Serdar Sezer üzerinde ortaya çıktı.

]]> https://www.serdarsezer.com/css-stilleri-ozelikleri/feed/ 0