İçeriğe geç

Kategori: Css

Block elements, inline elements

– user agent stylesheet: Tarayıcılar tarafından ön tanımlı olarak gelen değerler. http://trac.webkit.org/browser/trunk/Source/WebCore/css/html.css – normalize.css: Tüm tarayıcılar için standart hale getirilmiş css değerlerinin bütünü. https://necolas.github.io/normalize.css/ – block elements: Mozilla browser için css elemanlarına ön tanımlı olarak gelen değerler. https://developer.mozilla.org/en-US/docs/Web/HTML/Block-level_elements – inline elements:  Mozilla browser için inline olarak tanımlanmış css elemanları. https://developer.mozilla.org/en-US/docs/Web/HTML/Inline_elements…

Modern Css normalize.css

normalize.css bütün tarayıcılarda ki birbirinden farklı olarak ön tanımlı olarak gelen css özelliklerini sıfırlar ve bunları standart hale dönüştürür. Moder css tasarımlarında standart hale gelmiştir. Github https://github.com/necolas/normalize.css/ NPM npm install –save normalize.css CDN https://yarnpkg.com/en/package/normalize.css Download https://necolas.github.io/normalize.css/latest/normalize.css Kaynak kodu /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ /* Document ==========================================================================…

Reset CSS Kullanımı

http://www.cssreset.com/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, input, select,…

CSS İle Açıklama Yorum Satırları Ekleme

Her zaman yapmanızı tavsiye ettiğim bir olaydır. Şayet css kodları büyük projelerde ufak değişikliklerde bile başınıza bela olabilir. Bu yüzden hem sizin hangi kodun nereyi etkilediğini bilmeniz açısından hem de sizden sonra projeye dahil olacak front-end yazılımcılar için fayda sağlamak amacıyla yorum satırı mutlaka kullanılmalıdır.   Örnek uygulama: /* Bu…

Css ile dairesel resim efekti

1. CSS Background kullanarak yapmak Tek bir div kullanmamız yeterli olacaktır. CSS sınıfı olarak ben dairesel adını kullandım. HTML kodu <body> <div class=”dairesel”> </div> </body>   Şimdi CSS’i ayarlayalım. CSS Sınıf kodu <style> .dairesel{ width: 300px; height: 300px; border-radius: 150px; -webkit-border-radius: 150px; -moz-border-radius: 150px; background: url(http://resim-dosyasinin.adresi/resim.jpg) no-repeat; } </style> .dairesel img {…