개발자 양성과정 필기노트/WEB5 WEB || DAY5 || css 스타일 옵션 0. 블록레벨 & 인라인 레벨 h2, p, div 등 => 블록레벨 -> 자동줄넘김, width100%를 차지함 span, strong 등 => 인라인레벨 -> 블록레벨을 인라인으로, 인라인레벨을 블록으로 변경도 가능하다. 1. 컨텐츠영역 크기계산 옵션 box-sizing: border-box => 테두리선까지 포함해 크기를 지정함. center-box => 테두리를 제외한 크기로, 컨텐츠 내부의 크기로 지정한다. 기본값임. 2. 여백 padding: 테두리 내부의 여백 margin: 테두리 외부의 여백 3. 텍스트 지정 옵션 text-align: 텍스트 정렬 text-transform: 대소문자 변환 text-shadow: 그림자효과 text-decoration: none => 하이퍼링크의 밑줄을 없애.. 2021. 8. 28. WEB || DAY4 || html태그 옵션, CSS 0. 초기값 설정 // checked: 초기값으로 설정함 1. 데이터목록 생성하기 *** input태그의 list명과 datalist태그의 id명을 동일하게 설정해야한다! 2. 태그속 옵션 autofocus - 커서깜빡깜빡 placeholder="도움말" 3. 외부파일로 css적용하기 - html파일의 head태그 안에 -> 2021. 8. 19. WEB || DAY3 || HTML 기호, 테이블만들기, 파일경로 0. HTML 기호   ; (공백) < ; ( 기호. greater than) © ; (카피라이트 문자) & ; (앰퍼센드) " ; (쌍따옴표) 원하는 형태로 출력 큰 영역지정 작은 영역 지정 설명할 목록 상위항목 상위항목의 상세설명 1. 테이블 테이블제목 tr 행 / td 열 / th 가운데정렬 & 볼드체 2. 이미지 경로 1) 현재위치인 경우 -> . => 생략가능 2) 상위폴더에 있는 경우 -> . . => . . / 상위폴더이름 / 파일명 3. 문서안에서 항목간 이동하기 : 이동 할 대상에 id를 설정하고, 링크에서 href="#id값" 하면 뚝딱임 메뉴1 메뉴2 메뉴1 메뉴2 4. fieldset 네모칸만듦. 제목 2021. 8. 12. WEB || DAY2 || 회원가입창 만들기 1. 양식의 영역 : 회원가입 양식 전체를 묶는 태그. - action = "처리하는 페이지링크" >> 양식에 적힌 데이터를 담아서 데이터베이스로 전달하는 역할을 함. - method = "_____" >> get방식: 링크에 입력값이 나옴 // post방식: 링크에 입력값 나오지 않음. 2. 비밀번호 입력시 가리기 3. 텍스트 입력칸 만들기 4. 중복금지의 선택박스 만들기 => type = "radio" >> 동그라미 모양의 선택박스, 이름을 같이 지정 => 중복금지 성별 : 여성 남성 5. 중복선택이 가능한 선택박스 => ... 취미 : 여행 게임 독서 6. 목록상자 => 옵션추가 => 옵션창 크기지정 size="n" => 여러개 선택하기 multiple="multiple" 목록상자 선택 : 목록1 .. 2021. 7. 29. WEB || DAY1 || html태그 # 문단 나누기 # 볼드체 # 폰트 기울이기 # 하이퍼링크 # 이미지삽입 # 순서 있는 항목만들기 Ordered list - 하위 리스트의 모양지정 # 순서 없는 항목만들기 Unordered list - 하위리스트를 하얀동그라미로 표현하기 => # 표만들기 - 행 - 해당 행의 칸 1행의 첫번째 칸 1행의 두번째 칸 2행의 첫번쨰 칸 2행의 두번째 칸/td> # 열 합치기 => n==합친 열의 개수 # 행 합치기 => n==합친 열의 개수 1행 1열 + 1행 2열 2행 1열 + 3행1열2행 2열 3행 2열 2021. 7. 29. 이전 1 다음