HTML&CSS 3

[CSS] animation, @keyframes

animation CSS3에서는 animation 속성을 사용해 요소의 현재 스타일을 다른 스타일로 변화시킬 수 있다. Animation 속성 animation : 모든 animation 속성을 이용한 스타일을 한 줄에 설정할 수 있다 animation-name : 애니메이션 효과의 이름 설정 animation-duration : 애니메이션 효과를 재생할 시간 설정 animation-delay : 애니메이션 효과가 나타나기까지의 지연시간 설정 animation-iteration-count : 애니메이션 효과가 몇 번 반복될지를 설정 animation-direction : 애니메이션의 진행 방향을 설정 animation-timing-function : 애니메이션 효과의 속도 곡선을 설정 animation-..

HTML&CSS 2023.03.09

[HTML&CSS] HTML 기초

HTML이란 웹 문서에 문단이나 제목, 멀티미디어(이미지,표,동영상 등)을 정의하고 그 구조와 의미를 부여하는 정적 언어이다. 쉽게 말하면 웹의 구조를 담당하는 언어라는 뜻으로 HTML은 짜임새 있는 틀을 잡는 용도로 사용하는 것이 좋다. 마크업 언어라고 불린다. HyperText 하이퍼 텍스트는 문서와 문서간의 연결을 의미하는 링크를 말한다. 일반적으로 우리가 사용하는 하나의 웹 페이지에는 수많은 링크들이 연결되어 있다. 네이버만 생각해도 우리가 쓸 때 홈페이지에만 머물러 있지 않고 뉴스를 보거나, 메일함을 들어가거나, 검색을 하는 등의 행위를 통해 다른 페이지로 이동하며 사용하는데 이런 웹 사이트의 특성을 담은 말이 Hypertext라고 보면 된다. Markup Language 마크업 언어는 문서의 ..

HTML&CSS 2022.12.26

[HTML/CSS] CSS 기초

CSS(Cascading Style Sheets) HTML과 같은 마크업 언어가 표현되는 방법으로 CSS는 반드시 HTML이 있어야만 동작할 수 있다. 스타일링을 위한 도구이며 구조의 외부와 내부를 꾸미는 역할을 담당한다. CSS를 작성해서 간단한 UI를 만드는 일은 개발자의 기본적인 소양이다. *사용자 인터페이스 (UI) : 사람과 컴퓨터 프로그램이 소통할 수 있도록 만들어진 요소 1. CSS의 문법구성 . 셀렉터 : 태그 이름, ID, 클래스를 선택한다. 속성 : 요소에 적용할 수 있는 내용이다. 세미콜론(;) : 속성끼리 구분한다 2. CSS 스타일을 적용할 수 있는 방법 3가지 : 관심사 분리를 위해 외부스타일을 선호한다. 인라인 스타일 : 같은 줄에서 스타일을 적용하는 인라인 스타일 태그에 직접..

HTML&CSS 2022.12.24