JAVAIARY

목록 스타일 1. list-style-type list-style-type : 불릿스타일 ; - 불릿모양/번호 스타일을 지정 2. list-style-image list-style-image: | none - 기본 불릿 대신 이미지 파일 사용도 가능 3. list-style-position list-style-position : inside | outside - 들여쓰기 4. list-style list-style - 목록 속성을 한꺼번에 표시 표 스타일 1. caption-side caption-side : top | bottom - 표 제목의 위치 지정 2. border table{ border: 1px solid black } td, th{ border: 1px dotted border } - 표의..

1. font-family 속성 font-fmaily : | [, ] body{font-family : "맑은 고딕", 돋움, 굴림} - body전체에 맑은 고딕 글꼴을 적용함. 맑은 고딕 글꼴이 없을 시 돋움, 돋움이 없을 시 굴림 적용 2. font-size 속성 font-size : | | | - xx-small

1. 전체 선택자 - * {속성 : 값; ....} - 스타일을 문서의 모든 요소에 적용할 때 사용 2. 타입 선택자 - 태그명 {스타일 규칙} - 해당 태그 요소에 적용할 때 사용 3. 클래스 선택자 - .클래스명 {스타일규칙} - 문서의 일부에 적용하고 싶을 떄 사용 - 적용하고자 하는 태그 안에 class="클래스명" 속성을 지정하여 사용 - ex) .blue { color : blue} .accent {border : 1px solid #000} 이름 : * 2개 이상 적용할 때는 공백으로 구분 4. ID 선택자 - #아이디명 {스타일 규칙} - 문서에서 딱 한 번만 적용 가능(중복사용 불가) - 주로 문서의 레이아웃과 관련된 스타일을 지정하거나 웹 요소에 자바스크립트 프로그램을 사용하면서 요소를..

외부스타일시트 선택자를 이용해 작성해 놓은 스타일 시트를 .css파일로 저장하여 원하는 html문서에 불러와서 적용할 수 있는 기능 장점 - 내용과 스타일을 분리하여 데이터 관리가 쉬워짐 - 동일한 스타일을 여러 페이지에 적용할 때 유용 h1 { color : navy; font-size : 3.5em; font-style: oblique; } h1: 선택자 color: 속성 navy: 속성값 .css 파일에 저장한 내용 외부스타일시트 적용하기

내부스타일시트 body 태그 보다 먼저 와야 웹문서를 읽기 전에 미리 스타일 정보를 읽어들이고 적용하여 출력함 내부 스타일시트 만들기(제목) 마젠타 제목 1 단락 111111111111111111111 2 단락 222222222222222222222 3 단락 333333333333333333333 See the Pen Untitled by Javaiary (@javaiary) on CodePen.

form 태그내에 - input태그의 다양한 속성들을 이용해보기 - 드롭다운 메뉴와 선택목록제공하기 - 버튼 생성하기 테두리 제목 주문 상품 이름 배송 주소 이메일 연락처 메모 select 태그 사용하기 옵션1 옵션2 옵션3 datalist 태그 사용하기 옵션1 옵션2 옵션3 제출(전송) 초기화 기능 없음

1) form 태그 안에 다양한 태그, 속성들을 이용하여 양식 생성 가능 2) form 태그는 웹브라우저가 서버에 정보를 넘겨주는 것 까지만 담당 3) label 태그 표시할 값 인식값이 같은 것 끼리 한 덩어리로 인식하므로 태그 안에 모두 넣을 필요가 없어진다. form 태그를 이용하여 텍스트 입력창, 비밀번호 입력창, 전송(submit)버튼, 체크박스, 라디오버튼 스핀박스, 슬라이드 바 날짜 선택창 삽입하기 아이디 : 비밀번호 : 웹에서 보이는 값 선물 포장 개 (최대 5개) 개 (최대 5개)

표제목 표제목 1행 1열 표제목 1행 2열 표제목 1행 3열 2행1열 2행2열 2행 3열 3행,4행 1열 3행 2,3열 4행 2열 4행 3열 5행 1열 5,6행 2,3열 6행 1열 대체텍스트 새탭으로 열기 audio, video 속성 controls 컨트롤 바 표시 autoplay 오디오나 비디오를 자동 실행 loop 오디오나 비디오를 반복 재생 muted 오디오나 비디오의 소리를 제거 preload (auto, metadata, none) 비디오파일 로딩 방법 지정 width, height 비디어 플레이어의 너비와 높이 지정 poster "파일이름" : video가 재생되기 전까지 화면에 표시될 포스터 이미지 지정