WEB/CSS (7) 썸네일형 리스트형 CSS3 - 프로젝트용 css Python 웹 프로젝트 v1 Home 회원가입 로그인 게시판 회원정보 게시판 새글쓰기 제목 작성자 zzyzzy 본문 입력완료 다시입력 copyright © zzyzzy. all right reserved. CSS3 - project (웹) Python 웹 프로젝트 v1 Home 회원가입 로그인 게시판 회원정보 게시판 새글쓰기 제목 작성자 zzyzzy 본문 입력완료 다시입력 copyright © zzyzzy. all right reserved. CSS3 - float, flex CSS float 관련 속성 개요 html요소의 배치는 일반적으로 위에서 아래로 배치됨 하지만, 이러한 배치방식을 바꾸어 다른 요소들과 잘 어울리게 좌우로 배치하고 싶다면 float 속성을 사용 웹페이지 레이아웃 구성에 자주 사용 contact store support cart ♯1 ♯2 float의 원래 용도는 텍스트와 이미지를 함께 배치할 때 이미지 주위를 텍스트로 감싸기 위한 것이었음 dsasasasasasasasasasasasasasasasasasasasasasasasasasasasasasasa dsasasasasasasasasasasasasasasasasasasasasasasasasasasasasasasa dsasasasasasasasasasasasasasasasasasas.. CSS3 - background, table CSS background 속성 outline 해당요소의 배경으로 색상 또는 이미지를 지정할 수 있음 색상지정 background-color 속성으로 요소의 배경색을 지정 배경이미지 지정 background-image 속성으로 요소의 이미지를 지정 이미지의 크기가 요소의 크기보다 작으면 반복됨 sdsdsdasdgerwgvr 배경이미지 반복설정 background-repeat 속성으로 배경이미지와 반복여부 설정 배경이미지 크기 지정 background-size 속성으로 배경이미지의 크기를 설정 단, 배경이미지를 지나치게 키우면 이미지의 가장자리가 계단처럼 깨짐 -배경이미지가 bitmap인 경우 이미지 계단현상 줄이는 기능 anti-aliasing hhhhhhhh 배경이미지 위치 지정 background-p.. CSS3 - list, position CSS 리스트 관련 속성 개요 순서 있는(없는) 목록을 스타일링할 때 글머리 기호를 제거하거나 글머리 기호를 이미지로 대체할 수 있음 디아블로 스타크래프트 월드오브워크래프트 디아블로 스타크래프트 월드오브워크래프트 단축표기 list-style 속성의 단축 표기는 '글머리기호 - 기호위치 - 기호이미지' 순으로 작성함 디아블로 스타크래프트 월드오브워크래프트 CSS 포지션 관련 속성 개요 지금까지는 margin / padding 또는 인라인 / 블록요소의 특성에 의해 부분적으로나마 위치를 지정할 수 있었음 position이라는 속성 이용하면 HTML 요소들의 위치를 좌표등으로 결정 즉, top, left, bottom, right 속성등과 함께 요소의 위치를 정할 수 있음 static position 기본적인.. CSS3 - text, display CSS 텍스트 관련 속성 개요 폰트 크기, 지정, 스타일, 텍스트의 정렬등을 다룰수 있음 font-xxx 속성 font-size : 텍스트의 크기를 지정 font-family : 텍스트의 폰트를 지정 font-weight : 텍스트의 진하기를 지정 font-style : 텍스트의 스타일을 지정 font-xxx 단축 표기 : 클래스 선택자 : 미리 정의해둔 스타일에 이름을 부여한 뒤 여러 요소에 일괄적 스타일 적용 단, 선택자 적용시 class 속성을 사용 아이디 선택자 : 유일한 이름을 가진 요소에 스타일 적용 단, 요소에 id 속성으로 이름이 지정되어 있어야 함 속성 선택자 : 지정한 속성이나 속성값이 있는 요소에 스타일 적용 조합(결합) 선택자 : 스타일을 적용할 대상이 하나 이상인 경우에 사용하는 .. CSS3 - selector, reset css3 개요 스타일 시트 웹페이지의 스타일과 내용적인 부분을 서로 분리해서 내용에 디자인을 적용하기 위해 작성하는 서식을 의미 문서작성과 디자인을 분리하면 1. 협업, 스타일 변경시유지보수 용이 2. 태그만으로 구현할 수 없는 기능 수행 3. 전송 및 로딩시간 단축 css1:1996, css2: 1998, css3: 2005 CSS문법 CSS 사용위치 인라인 스타일시트: html요소 내에 style이라는 속성을 사용해서 css스타일을 적용 내부 스타일시트: html문서의 head 태그 내에 style이라는 태그를 사용해서 css스타일 적용 외부 스타일이스(추천) : html문서의 head 태그 내에 link라는 태그를 사용해서 외부 css파일을 통해 css스타일을 적용하는 방법 시간은 금이라고 친구!!.. 이전 1 다음
