تا %60 تخفیف خرید برای 8 نفر با صدور مدرک فقط تا
00 00 00
در توسینسو تدریس کنید

آموزش طراحی سایت با HTML و CSS قسمت 2 : Style ها و متن ها

Attribute ها خواص اضافی برای هستند که دارای اطلاعات اضافی درباره ی یک تگ HTML می باشند. از مهم ترین Attribute ها می توان id را نام برد که تگ ها را متمایز و class که تگ ها را گروه گروه می کند. خب حالا ما با تگ ها و attrinute های html آشنا هستیم و میخوهیم صفحه ای درست کنیم که داخل اون یک عنوان و یک پاراگراف نمایش داده شود. تگ p برای نمایش بند ها استفاده می شود و تگ های h1,h2,h3,h4,h5,h6 به ترتیب از کوچک به بزرگ عنوان های صفحه های HTML هستند.(سعی کنید در صفحات وب برای نوشتن عنوان ها از ترتیب کوچک به بزرگ استفاده کنید) خروجی: بعضی از تگ ها در HTML به شکلی نیستند که باز شوند و سپس بسته ! این تگ ها با Attribute ها مقدار لاظم خود را میگیرند و همانجا بسته می شوند!! در اینجا لیست بعضی از این تگها آورده شده است: به مرور با این تگ آشنا خواهیم شد. این تگ در قبل از body باز و بسته می شود و تگ هایی برای تنظیمات صفحه را در بر می گیرد. نمونه ای از این تگ ها title است که عنوان صفحه ی شما است و در قسمت Tab مرورگر نوشته می شود. خروجی: سپس یک عنوان و یک پاراگراف برای آن می گذارم: حالا می خواهم با CSS به آن Style بدم ولی نیاز است که در ابتدا شما با مفاهیم پایه ی CSS آشنا شوید. شما می توانید با استفاده از Attribute که html در اختیار شما گذاسته به تگ مورد نظرتون style اعمال کنید. شما می توانید تگ Style را داخل Head باز و بسته کنید و داخل آن شروع به نوشتن دستورات CSS کنید. شما می توانید با ستفاده از درست کردن فایلی با پسوند CSS و لینک کردن آن به صفحه ی خود با استفاده از تگ link که در Header باز و بسته می شود Style های خودتون رو به صفحه اعمال کنید. ما فعلا از نوع دوم استفاده خواهیم کرد و در جلسات بعد از نوع سوم بهره میگیریم.(نوع اول اصلا پیشنهاد نمی شود.) به این شکل میتوانیم از تگ style بهره ببریم. حالا باید با دستورات CSS آشنا شویم. ما برای دسترسی به تگ های HTML از طریق CSS نیاز به دستورات CSS داریم که بتوانیم دقیقا تگ یا تگ های مورد نظر خودمان رو Style دهی بکنیم . به دستوراتی که برای دسترسی به تگ های HTML نوشته می شوند Selector می گوییم. حالت کلی دستورات CSS به شکل زیر است: کد بالا تمام تگ های p استفاده شده در فایل html را انتخاب و آماده ی دادن style در داخل {,} می کند. "#" مشخص می کند که ما می خواهیم به یک تگ با یک آیدی دسترسی داشته باشیم و در جای tag- id نام Id قرار می گیرد.(راجع به Attribute های id وclass در جلسه ی قبل توضیح دادیم.) . مشخص می کند که مقصود ما تگ های دارای کلاس با نام class-name خواهد بود. راجع به Selector های پیشرفته تر در جلسات بعد توضیح خواهیم داد. ممنون از همراهی شما! محمد پارسا صفوی انجمن تخصصی فناوری اطلاعات ایران
نظر شما
برای ارسال نظر باید وارد شوید.
2 نظر
افرادی که این مطلب را خواندند مطالب زیر را هم خوانده اند