본문 바로가기

분류 전체보기556

1. CSS3 기초 CSS는 cascading style sheet의 약자로 그 중 현재 사용하고 있는 것은 CSS level 3이다. 이를 축약해서 CSS3라고 지칭한다. CSS는 이름 그대로 웹페이지의 스타일을 담당하는 언어이다. 스타일 시트에서 주로 사용하는 기능은 다음과 같다. 색상과 배경 텍스트 폰트 박스 모델 비주얼 포맷 및 효과 리스트 테이블 사용자 인터페이스 css 언어는 다음과 같이 구성된다. 셀렉터{ 프로퍼티 : 값; 프로퍼티 : 값; } 셀렉터에는 HTML 태그를 넣는다. 셀렉터가 지정되면 그 셀렉터만 {}(스타일시트 블록) 내부의 스타일 시트가 적용된다. 프로퍼티는 값과 쌍으로 표현되며 ;로 분리된다. 다음이 헤더 내의 CSS가 적용된 예시문이다. CSS스타일 맛보기 나는 웹 프로그래밍을 좋아한다. 2.. 2020. 3. 5.
6. 웹 폼 웹페이지를 통해 사용자 입력을 받는 폼을 웹 폼 혹은 폼이라고 한다. 폼은 다양한 형태와 이에 따른 태그들이 있으며, 이를 폼 요소 라고 한다. 다음은 폼을 만드는 간단한 예시이다. 로그인 폼 ID : PW : 폼 태그는 의 형태이다. name 속성은 폼의 이름을 설정하며, 이 이름은 자바스크립트를 할 때 이용된다. method 속성은 웹서버로 전송하는 형식을 지시하며, get과 post방식이 있다. get 방식은 url에 입력값을 포함하며, 주로 검색이나 글을 읽을 때 사용되고, post 방식은 url에 입력값이 포함되지 않으며 글을 쓰거나 수정할 때 주로 이용된다. action 속성은 폼 데이터를 처리할 웹 서버 응용프로그램을 지정한다. 폼 요소는 로 이루어진다. type에는 입력받을 값의 형식을 지.. 2020. 3. 4.
5. 미디어 삽입 기존 버전의 HTML과 다르게 HTML5에서는 별도의 플러그인 없이 오디오와 비디오를 재생할 수 있게 되었다. 이를 가능하게 해주는 것이 와 태그이다. -태그 비디오 플레이 브라우저가 video태그를 지원하지 않습니다. (controls 속성에 의해 비디오 제어 버튼이 출력되고, autoplay 속성에 의해 비디오는 바로 재생된다.) video 내부에 입력한 텍스트는 이 태그를 지원하지 않는 브라우저일 시 출력된다. video 태그에 이용되는 속성은 다음과 같다. width, height : 너비와 높이를 조절하는 속성. 생략하면 비디오 원본 크기로 재생된다. controls : 비디오 제어 버튼을 출력하는 장치 autoplay : 비디오 로딩 즉시 재생 loop : 반복 재생 muted : 오디오를 끌.. 2020. 3. 4.
4. 인라인 프레임 -태그 태그는 HTML페이지 내에 내장 윈도우를 만들고 다른 HTML 페이지를 출력할 수 있도록 하는 태그이다. 이렇게 태그를 이용해서 내장된 윈도우를 인라인 프레임이라고 한다. 인라인 프레임의 간단한 예시는 다음과 같다. 두 개의 iframe을 추가 태그 역시 웹서버와 연결되어있어야 한다. 속의 src 속성에 url을 입력하면 다른 사이트와 연결이 가능하다. (iframe으로 연결되지 않는 사이트도 있다.) 2개의 IT전문 사이트 가져오기 iframe에 name 속성을 이용해서 이름을 지칭하는 것도 가능하다. 이 name 속성과 태그를 학습할때 이용한 target 속성을 이용하면 두 개의 인라인 프레임을 이용하여, 왼쪽에서 링크를, 오른쪽에서 링크에 해당하는 페이지를 출력하는 것도 가능하다. -윈도우 .. 2020. 3. 3.
반응형