Programming (40) 썸네일형 리스트형 Html5_8/ 공간분할 태그 - div, span 태그 Html에서 공간을 분할하는 이유 : 공간을 분할해야 CSS를 사용해 원하는 레이아웃을 구성할 수 있다. 공간분할하는 형식은 Block형식과 Inline 형식으로 나뉜다. block은 빌딩처럼 층층이 분할 inline은 가로로 길게 한 층을 칸칸이 분할 *공간분할 태그 - block 형식으로 공간분할 - inline 형식으로 공간분할 Block Block Block Block Block Inline Inline Inline Inline Inline InlineInlineInline h1~6 / div / p / ul / ol / li / table / form 글자 글자 span / a / input / 글자형식태그(b/i/del/sub/sup...) 글자 글자 글자 /*참고로 는 inline처럼 보이는.. Html5_7/ 입력양식 태그(2) - textarea, select 태그 input 태그가 아닌 입력양식 : textarea태그, select태그 textarea태그의 속성 - cols - 태그 너비 지정 - rows - 태그 높이 지정 select : 여러개 목록에서 몇가지 선택할 수 있는 입력양식 요소. 선택양식을 생성. (select 기능은 디자인적으로 별로라 실제론 css와 자바스크립트를 대신 사용함) *여러 개의 목록을 선택하고 싶을 때 쓰는 multiple 속성(중복 선택) - 옵션을 그룹화 - 옵션 생성 내용물 내용물 (textarea태그 안에 미리 글자를 입력하고 싶으면 글자 입력. textarea태그에 여러줄의 글자를 입력할 때, 공백X 띄어쓰기X 줄바꿈 하면 왼쪽에 여백없이 붙여서 작성.) 바나나 수박 딸기 Hello World Html5_6/ 입력양식 태그(1) - form, label, input 태그 form 태그 안에 input 태그 (내용물X) label 태그는 input 태그를 설명하는데 사용 (내용물O) label의 for속성의 속성값과 input의 id속성의 속성값 일치시키기. input태그의 type속성값 : button / checkbox / file(파일선택 버튼) / hidden / image / password / radio / reset(초기화 버튼) / submit(제출버튼) / text / ....... - 입력양식 설명하는 태그. legend태그는 fieldset태그 내부에서만 사용할 수 있다. 입력 양식 아이디: 비밀번호 인터넷 친구권유label> 광고label> 성별 남성: 여성: 기타: Html5_5/ 테이블 태그(표) table 태그 - 표를 만들 때 사용하는 태그. th, td태그 속성 rowspan - 셀 높이 지정 colspan - 셀 너비 지정 - 보더: 표 두께. (table태그는 border 속상 하나만 갖음.) Caption - 표 위의 캡션(이름표) - 표에서 하나의 행(가로줄) 이름 - th : 표 내부의 제목 셀 태그 나이 - 셀 높이 2칸 (두번째 줄) Data1 - data(일반 셀 태그) Data2 - 셀 너비(가로로 3칸) Html5_4/ 목록태그 웹페이지 상단에 있는, 웹페이지를 이동할 때 사용되는 메뉴를 네비게이션 메뉴라고 한다. 이 네비게이션 메뉴를 만들 때 목록 태그를 사용하는 것이 일반적이다. 기본적인 목록 태그 - 순서가 없는 목록 태그. unordered list - 순서가 있는 목록 태그. ordered list - 목록 요소. list 바나나 딸기 수박 키위 바나나 딸기 수박 키위 *Tip :: 중첩 목록 AB a b CD c d Html5_3/ 글자 태그(2) - a태그(앵커태그), 루비문자 앵커태그 - 서로 다른 웹페이지를 이동하거나 웹페이지 내부에서 특정한 위치로 이동할 때 사용. a태그만 사용한다고 웹페이지가 자동으로 원하는 웹페이지로 이동하진 않고, href 속성을 사용하여 이동하고자 하는 웹페이지를 지정. Document 글자 - 굵은 글자 태그 - 기울어진 글자 태그 - 밑줄 글자 태그 *빈 링크 : a태그는 하이퍼링크 기능을 제거하고 사용하는 경우도 있는데, 이 떄도 href 속성을 반드시 입력해야 한다. 웹 표준을 지키면서 이동하지 않는 태그를 만들 때는 속성값에 #입력. (빈 링크) 루비문자 - 일본어에서 자주 사용되는 글자 형식. 한자 위에 표시되는 작은 글자. 大韓民國 대한민국 - 위에 위치하는 작은 문자태그 *파이어폭스같이 루비 태그를 지원하지 않는 웹브라우저에선 rp태.. Html5_2/ 글자태그(1) - h1태그, p태그 제목 - Html5의 대표적인 글자 태그. heading의 약자. h1 - 첫 번째로 큰 제목 글자 태그 h2 - 두 번째 h3 - 세 번째 h4 - 네 번째 h5 - 다섯 번째 h6 - 여섯 번째 본문 - p태그 Document Nulla culpa fugiat ipsum qui nostrud nostrud laboris ullamco commodo. Commodo quis cupidatat cupidatat mollit ipsum aliqua do. Consectetur aliqua et nisi officia ullamco pariatur sunt. Aute labore labore est Lorem. Sit nulla do consectetur enim tempor adipisicing exerc.. html5 _1/태그, 요소, 속성, html5 페이지 구조 태그tag : 페이지에서 객체를 만들 때 사용하는 것. 요소 : 그 태그를 사용해 만들어진 객채. (대부분 요소와 태그를 구분하지 않는다.) [Hello World] ⇒ 요소 시작태그 끝태그 *시작태그만 입력 or 시작태그와 끝태그를 함께 입력하는 요소 : 또는 // 또는 // 또는 (내부에 무언가를 담을 것이 없이 선언함/외침) utf-8 : 문자 인코딩 방식(vsc는 ms에서 만든거라 자동으로 탑재돼있음) 일부 태그는 내부에 다른 태그를 넣을 수 있다. =태그 내부에 다른 태그를 넣지 못할 수도 있다. 속성 : 태그에 추가 정보를 부여할 때 속성을 사용. Hello World [속성이름="속성 값"]=속성블록 내부에 문자를 갖지 않는 img태그는 그림을 만들 때 사용하며, src속성을 이용해 어떤 이.. 이전 1 2 3 4 5 다음