728x90 반응형 웹UI/HTML_CSS26 2021.03.08) HTML/CSS - div, span/선택자, margin, padding block, inline style tag div 태그 (block style) 블록 스타일은 한 줄 전체 영역을 차지한다 style 적용 시 style은 설정한 크기만큼만 차지하지만 영역은 한 줄 전체를 차지한다 css에서 display: inline으로 설정 시 span태그와 동일하게 적용된다 inline-block으로 설정 시 div태그를 유지하면서 inline처럼 사용 가능하다 span 태그 (inline style) 인라인 스타일은 텍스트의 크기 만큼의 영역만 차지한다 style 적용 시 적용되지 않는 경우가 있음 css에서 float: left; 를 사용하면 span이나 div의 block에 빈공간 없이 출력된다 -> 비어있는 영역을 강제로 삭제 margin 바깥쪽 간격을 띄울 때 margin.. 2021. 3. 8. 2021.03.05) HTML/CSS - basic 경일아카데미 경일아카데미 경일아카데미 경일아카데미 경일아카데미 경일아카데미 경일아카데미 이곳은 영역입니다. 이곳은 영역입니다 안녕하세요 1 안녕하세요 2 안녕하세요 3 안녕하세요 4 한 칸 띄기 문단 나누기 버튼 남자 여자 한글 깨짐현상 발생 시 인코딩 확인 >> 아이디: 비밀번호: 비밀번호 확인: 생년월일: 성별: 남자 전화번호: -- 취미: 독서 산책 TV input radio, checkbox 의 속성으로 name을 그룹별로 같게 써줘야한다 아이디 비밀번호 비밀번호 확인 생년월일 성별남자 전화번호-- 취미독서 산책 TV html에 CSS를 적용하는 방법 : 1. css파일 연결 2. head태그 내에 style태그 작성 후 선택자로 적용 3. 각 태그 내에 style속성 작성 2021. 3. 5. HTML - div와 span 공통점 : 의미 없이 요소를 묶는 태그 -> container : 웹이 단순한 문서에서 벗어나 형태를 갖게 되었기 때문에 자주 사용된다. 차이점 : div 태그는 block-level로 한 줄 전체 영역을 차지한다. : span 태그는 inline-level로 한 줄에 여러 영역이 들어갈 수 있다. : div의 margin은 4방향 모두 적용이 되며, span의 margin은 양옆으로만 적용이 된다. block block inline inline inline 2021. 3. 4. css 폰트 (font-family), 줄간격(line-height) font-family -> family-name과 generic-family로 구성 -> 버티컬 바 '|' 로 여러 폰트를 지정할 수 있다 -> generic-family는 family-name으로 지정한 폰트가 없을 시 대체 폰트를 사용 line-height -> 포느 사이즈를 포함한 간격 -> 브라우저마다 행간에서 폰트사이즈를 제외한 남는 간격이 홀수일 경우 처리 방법이 다르다 2021. 1. 12. 이전 1 2 3 4 5 6 7 다음 728x90 반응형