پیشنهاد فرادرس

آشنایی با CSS selector

دسته بندی ها: آموزش CSS ، آموزش طراحی وب ، آموزش های TreeHouse

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

سرفصل:

  • معرفی دوره
  • Attribute Selectors
  • استایل Form Buttons و لینک ها با Attribute Selectors
  • چالش Attribute Selectors
  • DRY CSS
  • چالش Combinators
  • Substring Matching Attribute Selectors
  • ناوبری Pseudo-Class
  • تابع attr() CSS
  • Selectors پیشرفته
  • Combinator های عمومی Sibling و Adjacent و Child
  • و غیره
CSS Selectors Course Publisher:TeamTreeHouse Author:Guil Hernandez Level:Beginner

In this short course, we're going to go beyond the basic selector concepts covered in CSS Basics. Besides the common ways to select elements with type, ID and class selectors, we're able to target elements based on their attributes, position in the HTML document, even their relation to other elements.
By the end of this course, you'll have gained a better understanding of the power and flexibility behind CSS selectors. You'll have a new set of valuable tools in your CSS toolkit to use on your next project.
About this Course
In this short course, we're going to go beyond the basic selector concepts covered in CSS Basics. Besides the common ways to select elements with type, ID and class selectors, we're able to target elements based on their attributes, position in the HTML document, even their relation to other elements.
By the end of this course, you'll have gained a better understanding of the power and flexibility behind CSS selectors. You'll have a new set of valuable tools in your CSS toolkit to use on your next project.
What you'll learn
Attribute selectors
Advanced pseudo-classes
Pseudo-elementsSelectors - Beyond the Basics
In this stage, we'll expand on basic concepts by learning all about attribute selectors, DRY CSS, and combinators.
8 steps
Course Overview
1:49
Attribute Selectors
8:44
Styling Form Buttons and Links with Attribute Selectors
3:34
Attribute Selectors Challenge
3 objectives
DRY CSS
10:51
Child, Adjacent, and General Sibling Combinators
9:03
Combinators Challenge
2 objectives
Attribute Selectors and Combinators Review
5 questions
Going Further with Attribute Selectors and Pseudo-Classes
Learn how to select elements without having to write extra classes or IDs in the markup. Target elements based on specific pieces of HTML attributes, user interaction states, or their position on the page.
8 steps
:first-child and :last-child
4:15
:first-child and :last-child Challenge
2 objectives
:only-child and :empty
4:58
Substring Matching Attribute Selectors - "Begins With" and "Ends With"
8:19
Substring Matching Attribute Selectors - "Contains"
6:44
Substring Matching Attribute Selectors Challenge
3 objectives
Element States Pseudo-Classes
6:20
Structural and Element States Pseudo-Classes Review
5 questions
Advanced Selectors
In this stage, we'll uncover the power behind many of the more advanced CSS selectors. Learn how to write selectors with simple expressions to target a combination of elements. We'll also use special selectors called pseudo-elements to insert virtual elements and content into our page.
11 steps
:nth-child
8:00
:nth-of-type
4:30
:nth Pseudo-Class Challenge
3 objectives
:nth Pseudo-Class Challenge - Pt. 2
1 objective
:root and :target
5:12
:not() – The Negation Pseudo-Class
4:46
Pseudo-Elements - ::first-line and ::first-letter
5:00
Pseudo-Elements - ::before and ::after
8:13
The attr() CSS Function
6:32
Pseudo-Elements Challenge
4 objectives
Advanced Selectors Review
6 questions

پیشنهاد فرادرس

لینک های دانلود حجم فایل: 231.0MB TeamTreeHouse CSS Selectors Course_git.ir.rar