css

از جمله امکانات مورد نیاز هر سایت یا وبلاگی وجود مجموعه ای از لینک ها به صورت منو جهت هدایت کاربران به صفحات مختلف و بخش های اصلی آن سایت یا وبلاگ است، این سبک منوها به لحاظ ظاهری و اصول فنی معمولا می توانند طیفی از خیلی ساده تا پیشرفته و همراه با جلوه های بصری گوناگون را شامل شوند اما در حالت معمول و برای رفع نیازهای عادی استفاده از کدهای ساده HTML به همراه استایل CSS کافی خواهد بود، اگر چه برای سازگاری بیشتر در کنار کدهای CSS از JavaScript نیز استفاده می شود اما در این...

اگر یک طراح وب حرفه ای یا علاقمند به طراحی قالب شخصی برای سایت یا وبلاگ خود باشید حتما با کدهای CSS آشنا هستید و بارها از آنها در شکل دهی فرم و ظاهر صفحات وب استفاده کرده اید، اگرچه کار با CSS به طور کلی چندان پیچیده و سخت نیست اما همواره جزئیات و ریزه کاری هایی وجود دارند که باعث می شوند نکاتی هرچند ساده به نظر مبهم و حل نشده باقی بمانند، در این مطلب می خواهیم یکی از شایع ترین این موارد را با هم مرور کنیم که تنظیم موقعیت عناصر HTML و به طور خاص...

امروزه در طراحی صفحات وب استفاده از بلاک ها و تصاویر شفاف یا به اصطلاح Transparent امری مرسوم است، به طور مثال طراحان قالب سایت ها و وبلاگ ها می توانند در طراحی هایشان پس زمینه مطالب را کمی شفاف در نظر بگیرند تا تصویری که در زیر بلاک مطالب قرار دارد به صورت نیمه شفاف و در واقع مخلوط با رنگ پس زمینه دیده شود، پیاده سازی این تکنیک پیشتر با تصاویر فرمت png صورت می گرفت اما مشکل و مانع همیشگی، مرورگر غیر استاندارد و ضعیف اینترنت اکسپلورر (IE) بود که قادر به نمایش این تصاویر با زمینه...

در طراحی صفحات وب گاهی مواقع موقعیت هایی پیش می آید که باعث سردرگمی و به زحمت افتادن طراح می شود به طور مثال فرض کنیم قالبی را برای وبلاگ یا سایتمان کدنویسی کرده ایم و انتظار داریم مطابق با سلیقه ما محتوا را نمایش دهد اما ناغافل متوجه می شویم که یک جای کار ایراد دارد و اسکرول افقی در انتهای صفحه دیده می شود، همان طور که می دانیم اسکرول افقی در صفحات وب چندان مطلوب نیست و در پیمایش صفحه و سهولت استفاده از رابط کاربری مشکل ایجاد می کند، به هر ترتیب با مطالبی که در...

به عنوان کاربر دنیای وب اغلب با مرورگرهای متفاوت به سایت ها و وبلاگ های مختلف سر می زنیم و بیش از هر چیز رسیدن به محتوای مورد نظر برایمان اهمیت دارد و کمتر به ظاهر سایت و وبلاگی که در حال بازدید از آن هستیم و اشکالات و ایرادات آن توجه داریم، فارغ از مسائل فنی مطلب را می خوانیم و در آخر هم صفحه را بسته و وبگاه را ترک می کنیم، اما در پشت صحنه کار برای مدیران حرفه ای وبسایت ها و وبلاگ ها داشتن قالبی استاندارد و اینکه همه کاربرانشان صرف نظر از مرورگری که...

از کدها و استایل CSS علاوه بر کاربردهای معمول و روزمره برای خلق جلوه های خاص در بستر وب نیز استفاده می شود، یکی از این جلوه ها که محبوبیت زیادی نیز بین طراحان وب دارد خلق منوهای کشویی (بازشونده) یا به اصطلاح Dropdown مبتنی بر تگ های ul li و CSS است، عملکرد این امکان به این صورت است که لیستی از منوها با قابلیت داشتن زیر مجموعه هنگام بردن نشانه گر ماوس روی تگ والد ظاهر و با خارج کردن ماوس از محدوده تگ والد مجددا به طور خودکار محو می شوند، نوع پیشرفته تر این منوها با...

در مطالب قبل از بخش آموزش های کاربردی با نحوه ساخت چند نوع منوی متفاوت مبتنی بر CSS و تگ های ul و li آشنا شدیم، همچنین به ضرورت استفاده از تگ های استاندارد ایجاد کننده لیست در HTML برای کدنویسی منوها و اهمیت آنها برای موتورهای جستجو و افزایش قابلیت های کاربری (Accessibility) و SEO صفحات وب اشاره کردیم، این بار و در ادامه آموزش ها می خواهیم با نحوه طراحی و ایجاد منوی آبشاری یا منوی عمودی (Vertical) با تگ ul li با استفاده صرف از خاصیت های زبان استایل نویسی CSS آشنا شویم، از نقاط مثبت این...

یکی از قابلیت های خوب افزوده شده به CSS از نسخه 3 به بعد امکان استفاده از قانون font-face جهت تعریف فونت های سفارشی و دلخواه است که پیش از این تنها در سیستم عامل کاربران قابل نمایش و در دسترس بودند، در صفحات وب به دلایل مختلف تنها فونت های خاصی که در تمام سیستم عامل ها نصب و قابل اجرا باشند پشتیبانی و سایر موارد به صورت پیش فرض (به طور مثال با فونت Arial) نمایش داده می شود، از این رو توسعه دهنده گان وب برآن شدند تا برای رفع این نیاز چاره ای اندیشه کنند تا...

گاهی مواقع در طراحی صفحات وب و کدنویسی HTML و CSS ممکن است بنا به دلایل مختلف نیاز به این داشته باشیم که مواردی را از چشم کاربران عادی پنهان و مخفی کنیم، به طور مثال شرایطی پیش می آید که بخواهیم بین کاربران عادی و ربات ها تفکیک قائل شویم، یعنی به طور مثال یک فیلد را فقط به ربات ها نشان دهیم، در چنین شرایطی برخی ترجیح می دهند از برنامه نویسی سمت سرور مانند PHP یا ASP در این گونه موارد استفاده کنند و برخی نیز به جاوا اسکریپت متوصل می شوند، اما در کنار همه این...

امروزه طراحی قالب وب (سایت، وبلاگ و...) بدون سر و کار داشتن با استایل نویسی CSS امری تقریبا غیر قابل تصور است، از این گذشته حتی آنهایی که در این باره تجربه اندکی دارند نیز به خوبی واقف هستند که صرف آشنایی با خاصیت ها و کارکردهای عادی کدهای CSS، جوابگوی تمام نیازها و ایده های طراح قالب نخواهد بود، از این رو همیشه مواردی پیش می آید که پا را از قواعد ساده CSS فراتر گذاشته و با تکنیک های ویژه آن کار کنیم، به هر صورت با ذکر این مقدمه در این آموزش می خواهیم یک تکنیک جالب...

حتما تا به حال سایت های زیادی را مشاهده کرده اید که در حاشیه صفحات خود منویی به صورت عمودی و شناور را به طور مثال برای بخش تماس یا پشتیبانی در نظر گرفته و نمایش می دهند، شاید برایتان جالب باشد که بدانید این نوع منوها چگونه ساخته می شوند و چگونه می توانید اینچنین ابزاری را به صورت سفارشی برای سایتتان داشته باشید، البته همان طور که می توان حدس زد، این امکان نیز به کمک خواص CSS قابل ایجاد است که در ادامه این آموزش، حتی الامکان به صورت مختصر و مفید می خواهیم نمونه ای از...