طراحی سایت

طراحی سایت نوتریکا ارائه دهنده بهترین خدمات طراحی سایت در ایران با پکیج های طراحی سایت شرکتی و طراحی سایت فروشگاهی و طراحی سایت شخصی و طراحی سایت اختصاصی

طراحی سایت

طراحی سایت نوتریکا ارائه دهنده بهترین خدمات طراحی سایت در ایران با پکیج های طراحی سایت شرکتی و طراحی سایت فروشگاهی و طراحی سایت شخصی و طراحی سایت اختصاصی

پیوندها

۲ مطلب با کلمه‌ی کلیدی «سی اس اس» ثبت شده است

آموزش سی اس اس

notrika webdesign | چهارشنبه, ۴ فروردين ۱۳۹۵، ۰۱:۰۸ ب.ظ

آموزش سی اس اس

در قسمت اول با استفاده از CSS یک قالب دو ستونی کلاسیک با navigation سمت چپ ایجاد کردیم که تنها چند نوع تگ HTML داشت. قسمت اول کد صفحه را ارائه کرده و توضیح می‌داد که قرار است از چه تگ‌های HTML استفاده کنیم.
همانطور که می‌دانید، تمام محتوایی (متن، عکس، فلش، و غیره) که کاربر هنگام مشاهده یک صفحه وب می‌بیند با HTML مشخص شده و بین تگ‌های <body> و </body> قرار دارد.
در این مورد داریم:

<body>
<div id=”navigation”>
<h2>The Main navigation</h2>
</div>
<div id=”centerDoc”>
<h1>The Main Heading</h1>
<p>
</p>
</div>
</body>

توجه :
شما باید صفحه ‌HTML ساده خودتان را ایجاد کنید به طوری که بتوانید با من همراهی کرده و گام به گام صفحه را ایجاد کنید.

در کد بالا دو بخش اصلی مشاهده می‌کنیم که هر کدام در داخل تگ‌های <div> محصور شده‌اند. همانطور که در قسمت اول این آموزش یاد گرفتیم، تگ‌های <div> برای این طراحی شده‌اند تا برای ایجاد یک «قسمت» در سند یا به عبارت دیگر، یک ظرف مورد استفاده قرار بگیرند.
دو لفاف مانند آنچه گفتیم ایجاد کرده و هر یک از آن‌ها را با یک ID (یا شناسه) منحصر به فرد نامگذاری می‌کنیم:

  • notrika webdesign

مقدمه‌ای بر CSS

notrika webdesign | جمعه, ۱۶ بهمن ۱۳۹۴، ۱۲:۲۰ ب.ظ

مقدمه‌ای بر CSS

گام بعدی ما یادگیری CSS  است که به ابزاری کلیدی برای طراحان امروزی وب محسوب می‌شود.

CSS چیست؟

CSS مخفف کلمات «Cascading Style Sheets» به معنی شیوه‌نامه‌های آبشاری است. سی اس اس خواهر خوانده زبان کد نویسی HTML است که امکان می‌دهد صفحات وب‌تان را قالب بندی کنید. نمونه‌ای از تغییر در قالب بندی تیره کردن کلمات است. در HTML استاندارد می‌توانید از تگ <b> برای این‌کار استفاده کنید:

<b>make me bold</b>

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

نقطه ضعف دیگر آن را می‌توان در این مثال جستجو کرد: فرض کنیم می‌خواهید متن بالا را پر‌رنگ کرده، فونت آن Verdana انتخاب نموده و رنگ آن را به قرمز تغییر دهید؛ برای این‌کار به مجموعه زیادی از کد‌های دستوری در اطراف متن نیاز دارید:

<font color=”#FF0000″ face=”Verdana, Arial, Helvetica, sans-serif”>

<b>This is text</b></font>

  • notrika webdesign