CSS Property Value   CSS 속성 값

(2019-01-08)

CSS 속성, rgb, rgba, alpha 투명도

1. CSS 구문 형식(선택,속성,값) 구문 형식 :  selector { property1 : value1 ; property2 : value2 ; ... }
     - selector          => CSS 선택자 
     - property : value  => CSS 속성 값의 지정 방법 (속성명 : 값)
        . 속성명 바로 뒤에 콜론(:) 을 붙인 후 그 값을 적음
     - 만일, 다수를 지정하려면 각각 사이에 세미콜론(;)으로 분리함


2. CSS 속성 종류

  ㅇ 주요 속성
     - 텍스트 꾸미기     ☞ CSS 텍스트 꾸미기 참조
     - 색상              : 2.항 참조
     - 박스              ☞ CSS 박스 모델 참조
     - 배경              ☞ CSS 배경 참조
     - 여백,테두리,패딩  ☞ CSS 여백,CSS 테두리,CSS 패딩 참조
     - 페이지 레이아웃(위치지정,효과,정렬 등)  ☞ CSS 위치 레이아웃 참조
     - 기타 등


3. CSS 속성 값  [ 색상 ] 색상 (Color)          :  { color : 값 }
     - color 키워드 
        . acua (바다물색), black (검정), blue (파랑), fuchsia, gray, green, lime, maroon,
          navy, olive, orange, purple, red, silver, teal, white, yellow

     - 색상 표현 방식 구분 
        . 키워드 방식               : 例) 백색 => { color : white; }
        . rgb(red,green,blue) 방식  : 例) 백색 => { rgb(100%,100%,100%); },
                                          흑색 => { rgb(0,0,0) }
        . rgba(red,green,blue,alpha 투명도) : 0.0 반투명, 1.0 완전 불투명
        . Hexa 값 방식              : 例) 백색 => #ffffff; 흑색 => #000000;


4. CSS 속성 값  [ 기타 ]리스트(목록) (List style)      :  { list-style : 값; }
     - list-style-type  : none, disc, circle, square, decimal, decimal-leading-zero,
                          upper-alpha, lower-alpha, upper-roman, lower-roman, ...
     - list-syle-position : outside, inside

  ㅇ 컨텐츠 속성                     :  { content : 값; }
     - HTML 문서로 쓰지 않고도, CSS 만으로도 내용 생성 가능,
       가상 선택자(:after,:before)와 함께 사용

  ㅇ 비표속성
     - 속성 이름 앞에 붙는 웹브라우저 제조사 접두어 ( Vendor-prefixed Properties)
     - (W3C 표준화 이전에, 웹브라우저별로 독점적인 구현)
        .  -wekit-속성명 : 크롬,사파리 등 Webkit 기반 브라우저
        .  -moz-속성명   : 모질라 파이어폭스 브라우저
        .  -o-속성명     : 오페라 브라우저
        .  -ms-속성명    : IE 브라우저


[웹 디자인] 1. 웹 디자인 2. 스타일 시트 3. CSS 4. CSS 선택자 5. CSS 박스 모델 6. block,inline 요소 유형 7. CSS 속성 값 8. CSS 위치 레이아웃 9. CSS 배경 10. CSS 텍스트 꾸미기

 
        최근수정     요약목록     참고문헌