|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/css-flexbox-grid-sass/
课程评论：没有评论
**课程名称：【韩文字幕】CSS 완벽 가이드 (Flexbox, Grid & Sass 포함)** **课程简介：** 本课程旨在帮助学员深入、清晰地理解CSS，从而构建更完善、更美观的网站。课程从CSS的基础知识讲起，逐步深入到高级和专家级别，内容涵盖理论与实际案例。完成本课程的学习，学员将能够独立构建一个完整的项目。 **学习本课程的原因：** CSS（Cascading Style Sheets）是将原始HTML页面转化为精美网站的“编程语言”。本课程全面覆盖CSS的定义、原理及使用方法，从最基础的概念开始，循序渐进地深入。课程结合实际案例和理论讲解，帮助学员扎实掌握CSS。虽然CSS入门看似简单，但其内涵深厚。因此，本课程提供了不同的学习路径（基础、高级、专家），以适应不同学员的需求和现有知识水平。 **课程结构：** * **基础轨道 (Basic Track):** 从零开始，扎实掌握CSS基础知识。按顺序学习所有课程。 * **高级轨道 (Advanced Track):** 适合已了解CSS基础（如选择器及其工作原理），但希望深入学习更高级功能和用法的学员。 * **专家轨道 (Expert Track):** 适合已具备高级CSS知识，并希望深入学习Flexbox、CSS Grid、CSS变量、Sass等功能的学员。 **课程内容概览：** 1. **理论与实践结合：** 课程将理论知识与实际代码示例相结合，并通过一个完整的项目中进行应用。此外，还包含各种练习、测验和挑战，帮助巩固所学概念。 2. **项目介绍：**学员将构建一个虚拟网络托管公司的前端网页，包括多部分组成的起始页面，以及利用侧边抽屉动画实现的响应式设计。课程还将涵盖模态框、表单、CSS动画、字体样式等多种元素的运用。 **详细课程主题：** * 选择器与组合器的基础知识，以及如何设定通用的样式规则。 * 属性、值和声明。 * 优先级和继承的原理，解释为何称为“层叠”样式表。 * “盒子模型”（Box Model）等核心理论概念。 * 改变元素布局的默认值。 * 图像和背景图像的样式设置（例如渐变）。 * CSS中常用的单位和尺寸（px, rem, %等）。 * JavaScript与CSS的交互方式。 * 响应式设计与“移动优先”的含义。 * 表单元素和表单输入元素的样式设置。 * 文本、字体及文本样式的处理。 * Flexbox：原理与用法。 * CSS Grid：用法及其与Flexbox的区别。 * 使用CSS实现HTML元素的变形和动画。 * 编写可维护的CSS代码，包括使用CSS变量和最佳实践的类名命名。 * Sass：用法和说明。 **课程目标受众：** * **适合人群：** * 希望构建更美观网站的Web开发初学者。 * 了解CSS基础，但希望进一步深入学习的开发者。 * 在使用CSS时遇到瓶颈，需要改进方法（是时候做出改变了！）。 * **建议慎重考虑人群：** * CSS技能已达专家级别，并能深刻理解CSS Working Group草案的开发者。 * 主要使用Node.js或PHP，不涉及HTML或前端JavaScript的后端专业开发者。 * Web开发初学者，需要从HTML基础开始学习的人员。 **讲师：Maximilian** 课程对所有经过深思熟虑后决定学习的学员表示热烈欢迎！期待在第一堂课上见到大家。
CSS를 더 깊고 명확히 이해하여 더 완벽하고 멋진 웹사이트를 구축하세요.CSS 기초부터 고급 트랙, 나아가 전문가 트랙 단계로 나눠서 구성하였습니다.이론과 실제 예시를 모두 다룹니다. 강의를 통해 프로젝트 하나를 완전히 구축하세요![본 강의를 수강해야 하는 이유]CSS는 Cascading Style Sheets(캐스케이딩 스타일 시트)의 줄임말로서 원시 HTML 페이지를 멋진 웹사이트로 만들 수 있는 ‘프로그래밍 언어'입니다.본 강의에 모든 내용이 포함되어 있습니다. CSS의 정의, 원리, 사용 방법 같은 아주 기본적인 내용부터 시작해서 점차 심화한 내용을 다룹니다. 본 강의는 실제 예시와 그 이론을 함께 살펴보는 방식으로 진행됩니다.CSS를 시작하기는 언뜻 쉬워 보일 수도 있으나 사실 CSS는 꽤 깊이 있는 언어입니다. 따라서 본 강의는 여러분의 필요 및 현재의 지식수준을 반영하여 다양한 ‘트랙' 또는 ‘진입점'을 제공합니다.[강의 구성]기본 트랙: 처음부터 시작해서 CSS의 기초부터 다집니다. 강의 1부터 순서대로 끝까지 수강하시면 됩니다.고급 트랙: 선택자가 무엇인지 어떻게 작동하는지와 같은 CSS의 기본적인 내용을 알지만 좀 더 깊게 알고 싶고 고급 기능과 사용법을 배우고 싶은 분들에게 적합한 트랙입니다.전문가 트랙: 고급 지식을 갖추었고 Flexbox, CSS 그리드, CSS 변수, Sass. 와 같은 기능에 대해 깊게 파고들고 싶은 분들에게 적합한 트랙입니다.[본 강의에서 다룰 내용]#1. 본 강의에서는 이론과 실제 예시를 모두 다룹니다. 강의를 통해 프로젝트 하나를 완전히 구축해 볼 겁니다. 이와 더불어, 다양한 과제, 퀴즈, 도전 과제를 제공해 여러분이 강의 과정에서 배우는 각 개념을 익힐 수 있도록 구성했습니다.#2. 본 강의의 프로젝트에 대한 설명 - 가상의 웹 호스팅 회사의 프론트엔드 웹을 구축합니다. 여러 부분으로 구성된 시작 화면을 만들고, 사이드 드로어 애니메이션을 활용한 반응형 디자인을 만들어 볼 것입니다. 모달과 폼, CSS 애니메이션, 폰트 스타일 등을 다양하게 활용해 봅니다![강의 세부 주제]강의의 세부 내용은 다음과 같으며 이는 앞서 언급한 강의 프로젝트에도 모두 적용해 볼 겁니다.선택자와 결합자에 대한 기본 사항, 일반 스타일링 규칙 정하는 방법프로퍼티와 값 및 선언명시도와 상속의 원리, ‘캐스케이딩' 스타일 시트라고 부르는 이유‘박스 모델'과 같은 주요 이론 개념요소가 배치되는 기본 설정값을 변경하는 방법이미지와 배경 이미지 스타일링하기 (예: 그러데이션)CSS에서 자주 사용하는 단위와 치수 (px, rem, % 등)JavaScript와 CSS가 상호작용하는 방식반응형 디자인과 ‘모바일 최적화'의 의미폼 요소와 폼 입력 요소 스타일링하기텍스트, 폰트 및 텍스트 스타일 작업Flexbox! Flexbox의 원리와 사용 방법CSS 그리드 사용 방법, Flexbox와 다른 점CSS를 활용한 HTML 요소 변형 및 애니메이션 적용CSS 변수나 모범 사례가 되는 클래스 이름 등을 활용해 미래에도 사용할 수 있는 CSS 코드를 작성하는 방법Sass 사용 방법과 설명[본 강의의 대상]이런 분들에게 적합합니다보다 멋진 웹사이트를 구축하고 싶은 웹 개발 초보자CSS를 알지만 보다 더 깊이 알고 싶은 분시행착오로 CSS 사용에 지쳐 개선이 필요하신 분 (이제는 바뀌셔야 합니다!)이런 분들은 좀 더 생각해보시길 바랍니다.CSS 실력이 전문가 수준이며 CSS 워킹 그룹 드래프트를 잘 이해하고 있는 분노드나 PHP를 사용하며 HTML이나 프론트엔드 JavaScript는 사용하지 않는 백엔드 전문 개발자웹 개발을 난생처음 배우며 HTML의 기본부터 배워야 하는 분이런 점들을 고려하여 본 강의를 수강하기로 결정하신 모든 분을 진심으로 환영합니다!1강에서 뵙겠습니다.- Maximilian
