فیلم آموزشی CSS به زبان انگلیسی – مقدماتی تا پیشرفته

[vc_row][vc_column][vc_custom_heading text=”در این دوره چه چیزهایی یاد می گیریم؟” font_container=”tag:h4|text_align:right” use_theme_fonts=”yes”][vc_column_text]این دوره آموزشی شامل 26 پارت است که تمام مباحث CSS در این دوره مطرح می شوند.[/vc_column_text][vc_custom_heading text=”اهداف این دوره آموزشی” font_container=”tag:h4|text_align:right” use_theme_fonts=”yes”][vc_row_inner][vc_column_inner][vc_column_text]

• خاصیت display
• کلاس های pseudo
• خواص float و clear
• انیمیشن توسط keyframe
• مدیا کوئری ها
• nth-child و nth-of-type
• استایل های متنی و تایپوگرافی
• خواص translate و rotate
• و…

[/vc_column_text][/vc_column_inner][/vc_row_inner][vc_custom_heading text=”پیش نیاز های این دوره آموزشی” font_container=”tag:h4|text_align:right” use_theme_fonts=”yes”][vc_column_text]آشنایی با زبان نشانه گذاری HTML[/vc_column_text][/vc_column][/vc_row][vc_row][vc_column][cdb_course_lessons arrow_sections=”true” title=”آموزش جامع CSS”][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” title=”1. A: The CSS Value of Auto” subtitle=”04:48″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/1-The-CSS-Value-of-Auto.mp4″ preview_video=”https://dl.rahkarino.com/video/web-design/atoz-css/1-The-CSS-Value-of-Auto.mp4″]در این ویدئو به معرفی و کاربرد مقدار پیش فرض auto در استایل های CSS پرداخته می شود.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” title=”2. B: The CSS Box Model” subtitle=”03:42″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/2-The-CSS-Box-Model.mp4″ preview_video=”https://dl.rahkarino.com/video/web-design/atoz-css/2-The-CSS-Box-Model.mp4″]در این درس، با خاصیت های box-sizing و padding و margin باکس ها آشنا خواهید شد.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”3. C: Color Syntax” subtitle=”05:37″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/3-Color-Syntax.mp4″]در این درس، انواع تعریف رنگ ها یا color را در CSS یاد می گیریم. مانند hsl و rgba و hex و…[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”4. D: The CSS Display Property” subtitle=”05:08″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/4-The-CSS-Display-Property.mp4″]در این درس، خاصیت مهم display و مقادیر آن در CSS بررسی می شوند. مانند block و inline-block و table و table-cell و…[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”5. E: The Enabled Pseudo Class” subtitle=”03:01″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/5-The-Enabled-Pseudo-Class.mp4″]در این درس، به معرفی اجمالی کلاس های سودو یا pseudo class پرداخته می شود. مانند enabled: و disabled: و…[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”6. F: Float and Clear” subtitle=”05:43″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/6-Float-and-Clear.mp4″]در این درس، خواص float و clear در CSS معرفی و بررسی می شوند.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”7. G: The General Sibling Selector” subtitle=”04:30″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/7-The-General-Sibling-Selector.mp4″]در این درس، درباره سلکتورهای Sibling در CSS آموزش داده می شود. مانند ~ و < و * و +[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”8. H: The Hover Pseudo Class” subtitle=”05:29″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/8-The-Hover-Pseudo-Class.mp4″]در این درس، کلاس های pseudo زیر در CSS بررسی می شوند: active: و hover: و visited: و غیره…[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”9. I: The ID Selector” subtitle=”06:09″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/9-The-ID-Selector.mp4″]در این درس، سلکتورهای class و id در CSS مورد بررسی قرار گرفته اند.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”10. J: Justify Text” subtitle=”05:14″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/10-Justify-Text.mp4″]در این درس، در مورد استایل justify در text-align و در grid ها صحبت می شود.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”11. K: CSS Keyframe Animations” subtitle=”05:23″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/11-CSS-Keyframe-Animations.mp4″]در این درس، ایجاد انیمیشن در CSS را توسط بلاک keyframes@ و خاصیت animation آموزش خواهیم دید.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”12. L: The CSS line-height Property” subtitle=”06:00″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/12-The-CSS-line-height-Property.mp4″]در این درس، به بررسی دقیق خاصیت line-height در المان های متنی HTML پرداخته می شود.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”13. M: Media Queries” subtitle=”06:14″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/13-Media-Queries.mp4″]در این درس، بلاک media@ به منظور استایل نویسی شرطی در CSS بررسی می شود.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”14. N: nth-child and nth-of-type Pseudo Class” subtitle=”06:35″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/14-nth-child-and-nth-of-type-Pseudo-Class.mp4″]در این درس، سودو کلاس‌های nth-child و nth-of-type در CSS آموزش داده می شوند.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”15. O: The CSS Opacity Property” subtitle=”03:51″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/15-The-CSS-Opacity-Property.mp4″]در این درس، خاصیت opacity در CSS توصیح داده می شود و نحوه استفاده از آن در انیمیشن و keyframes بررسی می شود.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”16. P: CSS Pseudo Elements” subtitle=”05:55″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/16-CSS-Pseudo-Elements.mp4″]در این درس، 5 نوع سودو المنت (pseudo element) معرفی می شوند، مانند before:: و after:: و نحوه ایجاد یک المنت در css آموزش داده می شود.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”17. Q: The CSS Quotes Property” subtitle=”04:22″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/17-The-CSS-Quotes-Property.mp4″]در این درس، درباره تگ blockquote و خاصیت quotes در CSS آموزش داده می شود.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”18. R: The Required Pseudo Class” subtitle=”04:50″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/18-The-Required-Pseudo-Class.mp4″]در این درس، استفاده از سودو کلاس required در فرم های HTML بررسی می شود.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”19. S: The CSS @supports Rule” subtitle=”06:40″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/19-The-CSS-@supports-Rule.mp4″]در این درس، بررسی می شود که آیا یک خاصیت در مرورگر ما پشتیبانی می شود یا خیر. با مراجعه به سایت caniuse و همچنین با استفاده از بلاک supports@[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”20. T: Text and Typography” subtitle=”06:21″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/20-Text-and-Typography.mp4″]در این درس، به معرفی و بررسی خواص متنی و تایپوگرافی CSS پرداخته می شود. مانند text-overflow و white-space و…[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”21. U: Unicode Range and @font-face” subtitle=”05:48″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/21-Unicode-Range-and-@font-face.mp4″]در این درس، نحوه استفاده از font-face@ برای تعریف فونت جدید در CSS آموزش داده می شود.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”22. V: Vertical-alignment in CSS” subtitle=”04:43″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/22-Vertical-alignment-in-CSS.mp4″]در این درس، نحوه وسط چین کردن یک المان بصورت عمودی (در محور yها) توسط خاصیت vertical-align آموزش داده می شود.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”23. W: Widows and Orphans” subtitle=”04:40″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/23-Widows-and-Orphans.mp4″]در این درس، درباره page media و خاصیت های orphans و widows صحبت می شود.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”24. X: The translateX CSS Property” subtitle=”04:23″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/24-The-translateX-CSS-Property.mp4″]در این درس، خاصیت های transform و translateX در CSS آموزش داده می شود.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”25. Y: The rotateY CSS Transform” subtitle=”06:23″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/25-The-rotateY-CSS-Transform.mp4″]در این درس، خاصیت rotateY و همچنین فضای 3D در CSS و نحوه چرخاندن المنت در محورهای عمودی و افقی آموزش داده می شود.[/cdb_course_lesson][cdb_course_lesson icon=”fas fa-play-circle” badge=”video” private_lesson=”true” title=”26. Z: The z-index CSS Property” subtitle=”07:55″ download_lesson=”https://dl.rahkarino.com/video/web-design/atoz-css/26-The-z-index-CSS-Property.mp4″]در این درس، درباره خاصیت z-index و نحوه استفاده از آن در position های مختلف مانند relative و absolute صحبت خواهد شد.[/cdb_course_lesson][/cdb_course_lessons][/vc_column][/vc_row]