Bildirgec’de daha önce şu yazıda css round ile yuvarlak köşeli kutucuklar hazırlanmasından bahsedilmişti.
Yazıyı çevreleyen yuvarlak köşeli bloklar oluşturmadan farklı olarak genellikle tablarda gördüğümüz üzerine gelince değişen yuvarlak köşeli linkler oluşturmak istersek şu CSS kodları kullanılabilir.
CSS’yi kodlamak kolay olabilir ancak buna rağmen her kodcuyu delirtebilecek bazı konseptleri de bulunmaktadır. Bu yazımızda kimilerine göre zor olan ancak anlaması oldukça kolay olan CSS derslerini bir araya getirerek CSS bilginizi bir adım daha ileriye taşımanıza yardımcı olacak dersleri inceledik.
1. CSS Sekmeler ve Navigasyon
1.1. Genişleyebilen CSS Sekmeleri Dersi
Genişleyebilir CSS sekmelerinin anlamı, sekmenin içerisindeki metnin uzunluğuna göre genişleyebilen sekme başlıklarıdır. Kodun özünde start.gif ve end.gif adında iki adet görsel bulunuyor. start.gif görseli boyutu genişletmek için kullanılırken end.gif görseli değişmeden kalıyor.
1.2. Gelişmiş CSS Menüsü
Bu rehberde Photoshop’taki watercolor efektini nasıl tasarlayabileceğiniz anlatılmış. Bu rehber size adım adım bir menü tasarımını nasıl kırpabileceğinizi ve ardından CSS kullanılarak nasıl onları bir araya getirebileceğinizi gösteriyor. Pek çoğunuz muhtemelen dikey ya da yatay menünün CSS ile nasıl kodlanacağını bilyorsunuzdur. Gelin şimdi bunu bir sonraki seviyeye taşıyarak CSS’nin position özelliğini kullanan gelişmiş bir menü tasarlayalım.
CSS Round size yuvarlak köşeli kutucuklar yapmanız için güzel bir imkan sunuyor. Bu servis sayesinde belirlediğiniz arkaplan, yazı rengi ve kutu rengi ile bir kutucuk oluşturuyorsunuz ve bu oluşturduğunuz kutuyu size verdiği 4 köşe resmi ve html kodlarıyla sahip oluyorsunuz.
Ayrıca genişliği ve köşelerin yarıçapınıda sizin ayarlamanıza olanak sağlıyor. İsterseniz genişlik belirtmeyerek sabit genişliği olmayan kutularda elde edebiliyorsunuz.
