본문 바로가기

반응형

디자인/CSS 강좌

(20)
CSS 기초강좌 5 (Text 속성 활용하기) CSS Text 속성 Text 속성은 문자나 단락의 조절과 관련된 속성들입니다. * color : 텍스트의 색상을 설정 * direction : 텍스트 방향설정 * letter-spacing : 텍스트의 글자 사이의 간격을 증가 또는 감소 * line-height : 텍스트의 행 높이를 설정 * text-align : 텍스트의의 수평 정렬을 지정 * text-decoration : 텍스트 장식(언더라인 등) * text-indent : 텍스트 블록의 첫 번째 줄의 들여 쓰기를 지정 * text-shadow: 텍스트에 그림자효과 설정 * text-transform : 대소 문자를 설정 * vertical-align : 수직 정렬을 설정 * white-space : 공백 설정 * word-spacing : ..
CSS 기초강좌 4 (Background 속성) CSS Background CSS background 속성은 요소의 배경효과를 정의하는데 사용됩니다. 배경효과에 사용되는 CSS 속성 * background-color * background-image * background-repeat * background-attachment * background-position background-color : 속성은 요소의 배경색깔을 지정하는데 사용합니다. background-image : 속성은 요소의 배경으로 이미지를 지정하는데 사용합니다. 기본적으로 설정이 없으면 이미지는 반복 표시됩니다. 이미지의 반복효과를 가로나 세로방향으로만 표시하고 싶을때는 background-repeat 속성을 사용합니다. (속성값) : repeat-x, repeat-y, no-r..
CSS 기초강좌 3 (적용방법) CSS 사용하는 방법 1.외부문서로 연결하여 사용하기 Html파일의 사이에 넣어서 정의하면 됩니다. 2.Html파일 내부에서 사용하기 이것도 마찬가지로 Html파일의 사이에 넣어서 정의하면 됩니다 만약 내부스타일정의 뒤쪽에 외부문서스타일이 링크된다면 내부스타일은 없어지고 외부스타일로 적용됩니다. 3.태그에 직접 사용하기 태그안에 style="요소"와 같이 사용하면 됩니다 이것은 P태그 입니다. Example 이것은 P태그 입니다. 결과 이것은 P태그 입니다. 즐거운 하루 되세요 Vanxy.
CSS 기초강좌 2 (Id와 Class) CSS Id와 Class CSS는 HTML 요소(태그,속성 등)들에 대한 스타일 설정합니다. 또한 'Class'와 'Id'라고 불리는 셀렉터를 이용하여 사용자가 직접 스타일을 지정할 수 있다. Id는 주로 한페이지에 한번만 나오는 내용에 대해 설정할때 사용된다 (예,메뉴바,copyright,상단헤더 등) Id 셀렉터는 기호 "#"을 사용한다. (외국인이 읽을때는 "해쉬 또는 파운드"라고 읽더군요) Class는 Id셀렉터와 달리 여러가지 요소들을 지정할때 주로 사용된다. (body안의 내용에 대한 스타일 적용시..) Class는 동일한 Class로 여러 HTML 요소의 스타일을 설정할 수 있다. Class는 기호 "."을 사용한다. Id와 Class 이름으로 숫자는 사용할 수 없다. 도데체 id와 clas..
CSS 기초강좌 1 (개요) CSS 문법 CSS 문법은 두가지 주요부분으로 구분된다: selector 와 선언부(declarations) 이다. 보통 셀렉터(selector)는 HTML의 태그문자이다. 또한 선언부는 속성(property)와 값(value)로 구성되어진다. 속성(Property)는 변화시키고 싶은 스타일(Style)의 속성(예를들면 색깔,글자크기,배경색깔,테두리크기...)이다. 그리고 각각의 속성들은 하나의 값만을 가진다. CSS선언부는 항상 세미콜론(;)으로 끝나며 선언부의 그룹들은 중괄호 {,}로 끝나야 한다. CSS를 보다 쉽게 이해하기 위해서는 한줄에 하나의 선언만을 나열하는 하는 것이 좋다. CSS의 주석처리는 /* 과 */으로 감싼다. 아래에 예제를 보면 이해할 수 있다. Example /* This is..

반응형