CSS 튜토리얼
CSS 튜토리얼은 웹 스타일링 및 디자인을 위한 체계적인 학습 경로를 제공합니다. CSS3 속성, 레이아웃 기술 및 반응형 디자인을 다루며, 초급 및 중급 웹 개발자 모두에게 적합합니다. 실습 랩과 실제 예제를 통해 매력적이고 반응형 웹 레이아웃을 만드는 경험을 얻을 수 있습니다. 저희 대화형 CSS 플레이그라운드를 통해 다양한 스타일을 실험하고 즉각적인 시각적 결과를 확인할 수 있습니다.
다른 스킬 트리
LinuxDevOps사이버 보안AWSCybersecurity EngineerDevSecOps컴퓨터 네트워크CompTIAKali LinuxWiresharkNmapHydraRed Hat Enterprise LinuxRHCSA 교육RHCE in Enterprise Linux 교육LFCS 교육ShellDevOps EngineerGitDockerKubernetesCKA 교육CKAD 교육CKS 교육AnsibleRHCE in Ansible 교육JenkinsCloudflare데이터베이스MySQLPostgreSQLRedisMongoDBSQLite데이터 과학빅 데이터PythonGolangRustJavaCC++웹 개발
작은 화면에서도 쓰기 좋은 폼 만들기
실제 로컬 신청에 보이는 레이블, 기본·조건부 제약, 반응형 스타일과 키보드 초점을 만듭니다.
HTMLJavaScriptCSS
실제 사진 갤러리 만들기
실제 로컬 이미지, 안정적인 사진 식별자, 보이는 키보드 초점을 갖춘 반응형 사진 전시를 만듭니다.
HTMLJavaScriptCSS
Whack-a-Mole 웹 게임 만들기
이 프로젝트에서는 HTML, CSS 및 JavaScript 를 사용하여 Whack-a-Mole 게임을 만드는 방법을 배웁니다. 게임은 지정된 시간 제한 내에 구멍에서 무작위로 나타나는 두더지를 두드리는 방식으로 진행됩니다. 필요한 HTML, CSS 및 JavaScript 파일을 만들고 단계별로 게임 로직을 구현합니다.
JavaScriptHTMLCSS
CSS 에서 배경 스타일 적용하기
다양한 CSS 배경 스타일 (색상, 이미지, 위치 지정, 반복 기법 포함) 을 적용하여 웹 페이지 디자인을 향상시키는 방법을 알아보세요.
CSSHTML
CSS 자손 선택자 적용하기
CSS 에서 자손 선택자를 사용하여 중첩된 HTML 요소의 스타일을 지정하는 방법을 배우고, 웹 페이지 디자인을 개선하며 선택자 타겟팅 메커니즘을 이해하세요.
CSSHTML
틱택토 (Tic-Tac-Toe) 웹 앱 만들기
이 프로젝트에서는 HTML, CSS, JavaScript 를 사용하여 틱택토 게임을 만드는 방법을 배웁니다. 틱택토는 3x3 격자판에서 두 명의 플레이어가 번갈아 가며 X 또는 O 를 표시하는 게임입니다. 가로, 세로, 대각선 중 한 줄을 먼저 완성하는 사람이 승리합니다. 필요한 HTML, CSS, JavaScript 파일을 생성하고 단계별로 게임 로직을 구현해 봅니다.
JavaScriptCSSHTML
Task Timer 웹 앱 만들기
이 단계별 프로젝트에서는 HTML, CSS 및 JavaScript 를 사용하여 Task Timer 웹 애플리케이션을 만드는 방법을 배웁니다. 이 웹 앱을 통해 사용자는 작업을 추가하고, 각 작업에 대한 타이머를 시작 및 중지하며, 작업을 삭제할 수 있습니다. 이 프로젝트가 끝나면 현대적이고 사용자 친화적인 인터페이스를 갖춘 완벽하게 작동하는 Task Timer 웹 앱을 갖게 됩니다.
JavaScriptHTMLCSS
Flask MySQL 로 URL 단축기 만들기
이 프로젝트는 Flask 와 MySQL 을 사용하여 간단한 URL 단축기 서비스를 만드는 과정을 안내합니다. 데이터베이스 설정, 웹 인터페이스 디자인, URL 단축 기능 구현, 태그별 URL 검색, 분석 보기 등을 배우게 됩니다. 이 프로젝트는 초보자도 쉽게 따라 할 수 있으며, Python 을 사용한 웹 개발 및 데이터베이스 관리에 대한 포괄적인 통찰력을 제공합니다.
HTMLPythonMySQLCSS
웹 개발에서 기본 CSS 선택자 적용하기
태그, 클래스, ID 선택자를 포함하여 웹 요소를 효율적으로 스타일링하는 기본적인 CSS 선택자 기술을 실용적인 예제와 모범 사례를 통해 알아보세요.
CSSHTML
React 를 사용하여 Notes 앱 만들기
이 프로젝트에서는 React 를 사용하여 간단한 Notes 앱을 만들 것입니다. 이 앱을 통해 사용자는 노트를 추가, 편집 및 삭제할 수 있습니다. 개발을 여러 단계로 나누어 각 단계가 특정 요구 사항을 충족하고 필수 기능을 추가하도록 할 것입니다.
ReactJavaScriptCSS
React 로 크리스마스 위시 리스트 앱 만들기
이 프로젝트는 React 를 사용하여 축제 분위기의 크리스마스 위시 리스트 빌더 웹 애플리케이션을 구축하는 과정을 안내합니다. 이 앱은 아름다운 전체 화면 크리스마스 테마 배경과 매력적인 눈송이 애니메이션을 특징으로 하여 휴가 분위기를 고조시킵니다. 사용자는 반투명 위시 벽에 소원을 추가할 수 있으며, 각 소원은 엽서 형태로 표시됩니다. 프론트엔드에는 React 를 사용하고, 스타일링 및 애니메이션에는 CSS 를 사용합니다.
ReactJavaScriptCSS
React 드래그 앤 드롭 퍼즐 게임 만들기
이 프로젝트에서는 React 를 사용하여 드래그 앤 드롭 퍼즐 게임을 만들 것입니다. React 컴포넌트, 상태 관리 및 사용자 상호 작용 처리를 배우는 초보자에게 훌륭한 프로젝트입니다. 이 프로젝트가 끝나면 기능적인 퍼즐 게임을 갖게 될 것입니다.
ReactJavaScriptCSS
CSS 에서 Margin 스타일 적용하기
HTML 요소 주변의 간격을 제어하기 위해 CSS margin 속성을 사용하는 방법, 다양한 margin 구문 이해, 웹 페이지 레이아웃을 향상시키기 위한 다양한 margin 스타일 적용 방법을 알아보세요.
CSSHTML
CSS 로 Box Shadow 만들기
기본 그림자부터 복잡한 다층 효과까지, CSS box shadow 기술을 마스터하여 웹 디자인에서 놀라운 시각적 깊이와 차원을 만드는 방법을 알아보세요.
CSS
타이밍 함수를 사용한 CSS3 트랜지션 생성
타이밍 함수를 사용하여 부드럽고 동적인 CSS3 트랜지션을 만드는 방법을 배우고, 호버 효과, 트랜지션 속성 및 고급 애니메이션 기술을 탐구합니다.
CSS
CSS 상대 위치 지정 적용
CSS 상대 위치 지정을 사용하여 이미지 및 요소의 레이아웃을 제어하는 방법을 배우고, 정확한 요소 배치를 통해 유연하고 동적인 웹 페이지 디자인을 만드세요.
CSSHTML
기본 속성으로 HTML 테이블 만들기
효과적인 웹 페이지 레이아웃 및 데이터 프레젠테이션을 위해 기본 태그, 헤더, 셀 병합 및 스타일링 기술을 사용하여 구조화된 HTML 테이블을 만드는 방법을 알아보세요.
HTMLCSS
HTML 에서 div 요소 생성 및 스타일 지정
HTML 에서 div 요소를 생성, 스타일 지정 및 조작하는 방법을 배우고, 블록 레벨 특성, 배경색 및 위치 지정 기술을 탐구합니다.
HTMLCSS
- 이전
- 1
- 2
- 3
- 4
- 5
- 6
- ...
- 20
- 다음