본문 바로가기

HTML6

📚 HTML5 입력, 선택 태그, 속성 알아보기 # : 입력하는 곳의 레이블을 표시 ㄴ입력 양식의 클릭 기능 영역 확장 ㄴ for : 어떤 양식의 입력값인지 레이블 지정 ​ # ㄴ id : 고윳값, 레이블과 연결 ㄴ autocomplete : 자동완성 ㄴ autofocus : 페이지로 들어올 때 커서가 위치 ㄴ disabled : 수정 불가, 값이 전송되지 않음 ㄴ name : 서버로 전송될 항목명 ㄴ readonly : 수정 불가, 입력된 값은 전송됨 ​ # : 일반 텍스트 입력 # : 패스워드 입력(······으로 표시) # : 전화번호 입력 (키 패드 표시) ㄴ placeholder : 입력 전 보이는 텍스트 ㄴ maxlength : 최대 글자 수 ​ # : 숫자 값 입력 ㄴ max : 최대 입력값 ㄴ min : 최소 입력값 ㄴ step : 입력.. 2023. 1. 10.
📚 HTML5 시멘틱태그 ✳ 시멘틱태그란? semantics - 의미가 부여된 태그 (# 대체사용) 구획의 용도와 내용의 의미를 알게 해 줌. 검색엔진 등 사이트를 분석하는데 도움을 줌. ✳ 시멘틱태그 사용하는 이유? HTML 문서의 가독성과 유지보수가 쉬움 검색엔진 최적화(SEO) 웹 접근성 ✳ 시멘틱태그의 종류 : 페이지 최상단 위치(ex. 제목, 로고, 검색창) : 페이지 최하단 위치 (ex. 작성자, 저작권정보 등) : 링크들 (현재페이지 내 구획 또는 다른 페이지) : '사이드바'로 이용, 주 내용과 간접적 연관 부분 : 의 주요 콘텐츠. 메인콘텐츠가 들어감. : 콘텐츠 내 큰 단위의 독립적 구획, 다른 시멘틱 태그의 의미에 해당 : 독립적으로 재사용되거나 반복적으로 나타나는 구획. (ex. 게시판, 뉴스, 갤러리의 목.. 2023. 1. 10.
📚 HTML5 인라인 요소와 블록 요소 ✳ inline 요소 ㄴ 수평으로 놓이며, 자체적인 크기가 없음. ㄴ 높이, 너비, 외·내부 여백 설정 불가. - 종류 : , , , , , , , , , , , , , , , , ​ ​ ✳ block level 요소 ㄴ 수직으로 쌓이며, 자체적 크기와 여백을 가짐(가로, 세로, 여 백지장 가능). ㄴ 부모 요소의 한 줄을 독점, 강제 줄 바꿈. - 종류 : , , , , , , ~ , , , , , , , ​ ​ ✳ lnline - block 요소 ㄴ lnline 요소와 block 요소의 특징을 혼합. ㄴ 자체적인 크기와 여백을 가짐. ㄴ 줄 바꿈을 강제하지 않음. 2023. 1. 10.
📚 HTML5 테이블 만들기 ✳ 테이블 태그 # : 표 만들기 ​ # : 표의 한 열(가로) ​ # : 각 열, 행의 머리(세로) scope = "col or row" : 열과 행 중 무엇의 머리인지 표시 ​ # : 표의 각 칸 ㄴ colspan="병합할 숫자 칸" : 가로로 n 개 병합 ㄴ rowspan="병합할 숫자 칸" : 세로로 n 개 병합 ​ # : 표의 제목 오늘자 식단표 아침 점심 저녁 밥 현미밥 호박죽 흰쌀밥 국 콩나물국 갈비탕 반찬 배추김치 2023. 1. 10.

티스토리툴바