썸네일 [웹개발] CSS 배경 설정 및 테두리 설정하기 안녕하세요 로로봉입니다 : ) 오늘은 CSS를 이용해 배경 설정 및 테두리를 설정하는 방법을 알아보도록 하겠습니다. 1) 배경 설정하기 웹 페이지의 body 또는 HTML 요소들의 배경색이나 배경 이미지를 설정할 수 있습니다. 배경 설정에 사용되는 속성은 아래 5가지가 있습니다. 속성명 기능 설명 background-color 배경색을 설정합니다. background-image 배경 이미지를 설정합니다. url("이미지 경로") background-repeot 배경 이미지의 반복을 설정합니다. repeat-x : 배경 이미지를 가로로 반복합니다. repeat-y : 배경 이미지를 세로로 반복합니다. no-repeat : 배경 이미지를 한번만 출력합니다. background-position 배경 이미지를 ..
썸네일 [웹개발] CSS 크기설정 및 위치설정하기 안녕하세요 로로봉입니다 : ) 오늘은 CSS를 이용해 크기 설정 및 위치 설정하는 방법을 알아보도록 하겠습니다. 1) 크기 제어하기 크기는 가로와 세로로 width와 height 속성으로 설정합니다. 값의 단위는 px, cm, pt, % 등을 사용할 수 있습니다. 2) 위치 제어하기 HTML 태그들의 위치는 position 속성으로 설정할 수 있습니다. position 속성의 값은 static, relative, obsolute, fixed 로 설정합니다. ① static static은 HTML 요소의 위치를 페이지 흐름대로 배치됩니다. HTML은 위치에 대한 설정을 하지 않으면 앞 부터 순차적으로 배치되며, 이는 position의 기본 값이 static이기 때문입니다. ② relative relativ..
썸네일 [웹개발] CSS 텍스트 제어하기 안녕하세요 로로봉입니다 : ) 오늘은 CSS를 이용해 텍스트를 제어해보도록 하겠습니다. CSS는 웹 페이지 내에서 텍스트의 색상, 글자체, 정렬, 크기 등 다양한 부분을 속성으로 설정하도록 제공합니다. 1) 글자색 글자색은 color 속성으로 설정합니다. color 속성에 설정할 수 있는 값은 걸러명, 색상표 값, RGB 값이 있습니다. // 컬러명으로 글자색 설정 p{color:red;} // 색상표 값으로 글자색 설정 p{color:#ff0000;} // RGB 값으로 글자색 설정 p{color:rgb(255,0,0);} 2) 폰트 CSS는 글자체, 크기, 폰트 스타일 등 폰트와 관련된 속성들을 설정할 수 있습니다. 스타일 명 기능 font-family 글자체를 설정합니다. font-size 글자 크..
썸네일 [웹개발] CSS 작성 방법 안녕하세요 로로봉입니다 : ) 오늘은 CSS 작성 방법에 대해 알아보겠습니다. CSS를 작성하는 방법에는 인라인(Inline), 인터널(Internal), 익스터널(External) 이렇게 3가지가 존재합니다. 이 3가지 방식은 작성법이나 스타일의 적용 범위가 다릅니다. 1) 인라인(Inline) 방식 인라인 방식으로 스타일을 적용하려면 HTML 요소에 style 속성으로 설정하면 됩니다. 빨간 글씨 검적 글씨 인라인 방식의 스타일 설정은 태그가 끝날 때까지만 유효합니다. 그래서 스타일을 한 번만 적용할 때 사용됩니다. 2) 인터널(Internal) 방식 인터널 방식은 HTML의 body 텍스트 색상 h3 텍스트 색상 p의 텍스트 색상 위와 같이 아이디 "A" 테스트 다음으로는 class를 이용하여도 위..
반응형