Esnek Genişlikli tasarımlar yani Responsive tasarımlar çıkmaya başladıkça artık cetvel kaçınılmaz oluyor. Chrome ve Firefox iki tarayıcıda aktif kullandığım için ikisindede bu eklentiyi bulmam lazımdı.
Bu eklentiler sayesinde sayfa genişliğini görebiliyor ve ona göre css yazabiliyorum. Aslında tüm tabletlerin, Telefonların genişliklerini içeren bir resmim var onuda farklı bir yazımda paylaşabilirim.
Firefox Cetvel Eklentisi
Firefox’a ekledikten sonra tarayıcıda “Eklenti Çubuğu”nun aktif olması gerekiyor. Eğer aktif ise tarayıcıda sağ alt kısımda cetvel işaretini görebilirsiniz.
L-Square Responsive Design Inspector
Browser pixel rulers to help inspect window widths of adaptive designs. The add-on button acts as a toggle that adds rulers similar to a graphics app to measure the current window resolution.
Firefox’a Ekle
Chrome Cetvel Eklentisi
Bu eklentiyi Chrome’ye kurduğunuzda ise sağ üst kısımda cetveli görebilirsiniz. Chromede bu eklentiyi kurmadan F12 açıkken kullanabiliyorsunuz kendi özelliğide var.
Browser pixel rulers to help inspect window widths of responsive web designs. Use this simple tool to toggle rulers similar to graphics programs to see X and Y values of the current browser window.
Chrome’ye Ekle
