본문 바로가기

HTML4

HTML(CSS박스) 박스의 기본크기를 결정하는 특성 가로축 부모를 가득 채움 세로축 자신이 포함하고 있는 내용만큼 설정됨. 내용이 없을 경우, 높이 X 박스의 크기를 구성하는 속성의 종류 속성 설명 적용값 width 내용 영역의 폭 px단위, %단위 height 내용 영역의 높이 px단위, %단위 border 박스의 테두리 굵기 종류 색상 padding 테두리와 내용 영역사이의 여백 여백사이즈에 대한 px단위 border속성 border : 굵기 종류 색상; 색상 : 16진수 색상값 (#ff00ff), rgb함수(rgb(255,255,255)) border 속성(테두리 종류) 종류 설명 예시 none 투명한 테두리 solid 직선 ㅡ dotted 점선 ······························· dashed 끊.. 2020. 7. 6.
HTML(CSS) CSS CSS = Cascadion Style Sheets HTML 태그에 디자인을 입혀주는 기법 HTML문서에 CSS를 적용하는 방법 1 2 3 4 5 6 CSS 구체성 단위 자식셀렉터 한 태그안에 1depth안에 존재해야 한다. 표현방법 : > 자손셀렉터 자식셀렉터는 1depth안에 존재해야 하지만 자손셀렉터는 depth를 제한하지 않는다. 속성셀렉터 태그의 속성에 따른 표현 스타일시트의 셀렉터가 적용되는 대상에게 특정 속성이 있는지 여부와 특정 속성의 값이 적용되어 있는지 여부에 따라 태그요소를 좀 더 구체적으로 가리킬 수 있다. 2020. 7. 3.
HTML(표, 멀티미디어, 입력양식) 표 표를 구성하는 태그들 태그설명표 영역 지정상단 제목 지정 (생략가능)본문영역하단 영역 (합계 등)한 줄을 형성열의 제목열의 내용 Table 구성시 사용가능한 기본 속성 속성적용가능한 태그설명값border표 테두리 두께 설정정수 형태로 입력width, , 넓이 설정, 칸의 넓이 합은 에 정의한 넓이보다 클 수 없음.px값(정수 값) 비율값(% 값)height, , 높이 설정, 칸의 높이 합은 에 정의한 높이보다 클 수 없음.px값(정수 값)align, , 정렬 설정, 칸 안에서의 내용의 가로 정렬left (왼쪽) center (가운데) right (오른쪽)valign, 정렬 설정, 칸 안에서의 내용의 세로 정렬top (위) middle (중간) bottom (아래)rowspan, 행 병합병합할 행의 수.. 2020. 7. 1.
HTML (화면 구현) 1. 화면 구현 작업 단계 1) 요구사항 확인 / 정의 - 무엇을 만들고 싶은가 구성하는 단계 - 제작한 페이지의 전반적인 기능들을 도출. * 대부분의 회사는 정의서와 명세서를 구분하지 않고 정의서 수준의 문서로 작업을 많이 함 2) UI설계(화면설계) - 요구사항들을 시각적으로 조금 더 구체화 하는 단계. - 와이어프레임, 목업 형태로 제작 와이어 프레임 뼈대 제작, 대략적인 레이아웃 목업 실제 구현을 위해 더 디테일하게 작업 3) 프로토타이핑(Prototyping) - 실제로 출시 전, 샘플로 제작하여 시작업하는 단계 - 카카오 오븐 : 무료, 웹 기반의 와이어프레임 도구 4) UI제작 - HTML은 주로 Sublime Text로 작업 (편함) - 실제품으로 제작, 코딩 ㄱㄱ 2. 웹 접근성 웹 사이.. 2020. 6. 30.

티스토리툴바