Frontend

02. CSS3 Selector

Hello CSS Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language such as HTML or XML. II. Universal Selector Hello CSS Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language such as HTML or XML. III. Tag Selector Heading paragraph 1 parag..

01. CSS3 기본 문법

Hello CSS Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language such as HTML or XML. style.cssh1 { color: red; } p { background: yellow; } Embedding (Internal Style Sheet) HTML 문서 내부에 internal style sheet를 포함시키는 방법이다. HTML과 CSS의 역할을 명확히 구분하는 것이 좋고, external style sheet는 internal style sheet와 달리 caching이 가능하다는 장점도 있기..

07. HTML5 사용자 입력

I. form 태그 form 태그는 사용자가 입력한 데이터를 수집할 때 사용한다. ID: USERNAME: value attribute를 사용해 초기값을 설정할 수도 있다. ID: USERNAME: action attribute를 사용해 사용자 입력 데이터가 전송될 URL을 지정할 수 있다. 또, method attribute를 사용해 입력 데이터를 전송할 방식, 즉 HTTP 메소드를 지정할 수 있다. get 메소드와 post 메소드를 선택할 수 있다. http://jsonplaceholder.typicode.com은 fake REST API를 제공하는 사이트이다. 이 웹 페이지는 Submit 버튼을 누르는 순간 http://jsonplaceholder.typicode.com/users에 get requ..

06. HTML5 이미지, 오디오, 비디오

I. 이미지 일반적으로 이미지의 너비와 높이는 CSS로 설정한다. II. 오디오 ℹ️src오디오 파일 path controls음악 재생 도구 표시 loop반복 재생 autoplay자동 재생. 크롬, 엣지 등 chromium 브라우저들은 autoplay attribute를 이용한 자동 재생을 허용하지 않기 때문에 다른 방법으로 자동 재생을 구현해야 한다. 하지만, 위 방법은 브라우저에서 해당 오디오 파일 형식을 지원하지 않는 경우 오디오 파일을 재생할 수 없다는 문제가 있다. 예를 들어, IE는 wav 파일 재생을 지원하지 않기 때문에 chopin.wav는 재생되지 않는다. 따라서, 오디오 파일 재생은 source element를 나열하는 방식으로 구현하는 것이 좋다. 브라우저는 나열된 source ele..