شروع یادگیری CSS
در خود آموز سریع CSS و با استفاده از مثال های موجود در آن، شما یاد خواهید گرفت که چگونه از CSS برای تنظیم استایل ها و ظاهر صفحه وب سایت استفاده کنید. و همچنین با نحوه ی کار با CSS و انواع Selectot ها و Property های آن و همچنین با پشتیبانی مرورگر های مختلف از انواع استایل ها آشنا خواهید شد. ...
|
معرفی CSS
چیزهایی که شما باید از قبل بدانید !
قبل از ادامه شما باید یک درک ابتدایی از HTML داشته باشید. برای این منظور شما باید در ابتدا به مقاله مربوط به آموزش HTML مراجعه نمایید.
در قدم اول می خواهیم بدانیم CSS چیست؟ ...
|
قواعد CSS
. ...
|
Selector های CSS
Selector های CSS به شما این اجازه را می دهند که عناصر HTML را دست کاری کنید. ...
|
استایل دادن به لینک ها
. ...
|
CSS border
توسط این خاصیت می توان دور عنصر مورد نظر کادر ایجاد کرد همچنین می توان خواصی همچون رنگ، ضخامت کادر، نوع کادر و ... را نیز برای border در نظر گرفت. ...
|
CSS margin
با استفاده از margin می توان فاصله ی بین عناصر را تعریف کرد. ...
|
CSS Padding
در واقع padding فاصله ای شفاف بین محتوای عنصر تا دیواره ی داخلی همان عنصر می باشد. ...
|
CSS position
با استفاده از این خاصیت شما می توانید موقعیت عناصر را مشخص نمایید به گونه ای که حتی یک عنصر پشت یا جلوی عنصر دیگر قرار گیرد. ...
|
چینش افقی متن (css horizontal align)
با استفاده از align ما می توانیم متون موجود در سند HTML را از چپ چین، راست چین و یا وسط چین نماییم . ...
|
عناصر شبه کلاس ها (CSS Pseudo-elements)
با استفاده از تعریف CSSبرای شبه کلاس ها شما می توانید به بخشی از عناصر styleدهی نمایید. ...
|
ساخت منو افقی و عمودی (Navigation bars)
برای هر وب سایتی داشتن یک navigation bar برای راحتی استفاده و دسترسی سریعتر ضروریست. از navigation bar ها غالبا برای ایجاد منو استفاده می شود. ...
|
CSS image sprites
چند عکس را که قبلا در کنار هم قرار داده اید و به یک عکس تبدیل کرده اید می توانید با استفاده از این روش و استفاده از کد های CSS از عکس های موجود در آن به صورت ظاهرا تکی و جدا از هم (دقیقا همان قسمتی که نیاز دارید) استفاده نمایید. ...
|
طراحی Responsive یا واکنش گرا (CSS media types)
برخی از خواص CSS برای نوع خاصی از رسانه طراحی شده است که ممکن است در رسانه ای دیگر به درستی نمایش داده نشود... ...
|
CSS attribute selectors
style دهی به عناصر در HTML با ویژگی ها یا مقادیر خاص ...
|
جدول ها (CSS Tables)
با استفاده از css می توان ساختار جدول ها را تا حدود زیادی بهبود بخشید ...
|
شبه کلاس چیست؟
شبه کلاس ها برای تعریف حالت خاصی از یک عنصر مورد استفاده قرار می گیرند. ...
|
وضوح تصویر و متن و...(CSS opacity)
با استفاده از CSS شما می توانید تصویر با وضوح کم یا transparent ایجاد نمایید. این کار توسط خاصیت opacity انجام میشود و در واقع جزء امکانات CSS3 محسوب می شود. ...
|
پس زمینه (CSS background)
یکی ازeffect هایی که میتوان به پس زمینه هر یک از عناصر داد، خصوصیت background می باشد. شما میتوانید مقادیر زیر را به خصوصیت background بدهید. ...
|
CSS-outline
در واقع با استفاده از این خاصیت می توانید دور عنصر مورد نظر خط بکشید (خارج از محدوده border) تا برجسته به نظر برسد. ...
|
CSS چگونه کار می کند؟
وقتی یک مرورگر صفحه وب را لود می کند ، عناصر موجود در صفحه وب را بر اساس فایل CSS یا همان (style sheet) و کد های موجود در آن قالب بندی و مرتب کرده و نمایش می دهد. ...
|
CSS Fonts
با استفاده از این خاصیت، می توانید برای متون موجود در سند HTML خود استایل دلخواه از قبیل : نوع فونت، برجستگی حروف (bold)، سایز نوشته ها را تعیین کنید. ...
|
CSS-list
. ...
|
مدل جعبه ای (CSS Box model)
در این روش هر کدام از عناصر HTML به عنوان جعبه در نظر گرفته می شوند. هنگامی که در css از طرح بندی و طراحی صحبت می شود اصطلاح مدل جعبه ای یا همان box model بکار گرفته می شود. ...
|
ابعاد در CSS
خاصیت بعد در CSSبه شما امکان کنترل عرض و طول را می دهد. ...
|
CSS Float
برای اینکه بتوانید عناصر را در کنار هم قرار دهید می توانید از خاصیت float استفاده کنید. ...
|
ترکیب کننده های CSS
ترکیب در واقع ارتباط بین selector ها را بیان می کند. یک selector یا انتخابگر css می تواند بیش از یک انتخابگر ساده داشته باشد. ما می توانیم بین selector های ساده ارتباط ایجاد کنیم. ...
|
آموزش صفحه بندی با CSS توسط float and clear
در این مقاله در باره float and clear در صفحه بندی صحبت خواهیم کرد. این ویژگی نقش مهمی در ریسپانسیو کردن صفحات بازی میکند. ...
|
آموزش طراحی سایت چیدمان عناصر در CSS
در این مقاله با مفاهیمی مانند margin: auto ، text-align: center ، position: absolute، float و غیره آشنا خواهیم شد. ...
|