Dev Blog by Yena

09 CSS 포지셔닝 09-1 CSS 포지셔닝과 주요 속성 box-sizing - 박스 너비 기준 정하기 박스 모델의 패딩이나 테두리를 따로 계산할지, 포함해서 계산할지 결정 속성 content-box - (기본) width 속성 값을 콘텐츠 영역 너비 값으로 사용. bordor-box - width 속성 값을 콘텐츠 영역에 테두리까지 포함한 값을 사용. 즉 content-box 속성으로 설정하면...

08 레이아웃을 위한 스타일 08-1 CSS와 박스 모델 블록 레벨 요소 / 인라인 레벨 요소 블록 레벨 요소 (block-level) 태그로 요소를 삽입했을 때, 혼자 한 줄을 차지하는 요소. 즉 해당 요소의 너비가 100%. 왼쪽이나 오른쪽에 다른 요소가 올 수 없다. <p> <h1>~<h6> <ul> <ol> <div> <blockquote> <form> <hr> <table> <fieldset>...

07 색상과 배경을 위한 스타일 07-1 웹에서 색상 표현하기 16진수 표기법 # 다음에 6자리의 16진수로 표시하는 방법. ex) #ffff00 앞에서부터 두 자리식 ##RRGGBB 형식이다. 각 색상마다 하나도 섞이지 않았을 경우 00, 가득 섞였을 경우 ff로 표시된다. rgb와 rgba 표기법 rgb(255, 0, 0) 이나 rgba(255, 0, 0, 0.5) 처럼 십진수로 표시하는...

06 텍스트 관련 스타일 06-1 글꼴 관련 스타일 font-family - 글꼴 지정 font-family:굴림; 과 같은 형태 글꼴이 없을 경우를 대비해 두 개 이상의 글꼴을 지정할 수도 있다. body { font-family: "맑은 고딕", 돋움, 굴림 } @font-face 속성 - 웹 폰트 사용하기 웹 폰트란 웹 문서를 작성할 때 웹 문서 안에...

05 CSS 기초 05-1 스타일과 스타일 시트 스타일? 미리 약속한 스타일 속성을 입력해 웹을 디자인 하는 것. 다양한 기기에 맞게 바뀌는 문서 작성 가능 웹 문서의 내용과 상관 없이 디자인만 변경 가능 구성 요소 선택자 : 어디에 스타일 규칙을 적용할 것인지 나타냄 속성, 속성 값: 각 스타일의 속성. 중괄호 안에...