우리는 같은 동네의 모임 이예요~~ 대표 속성

Chapter 13

우리는 같은 동네의 모임 이예요 *^^* 대표 속성

훗.. 스타일 시트가 속성들의 모임 이다보니..

별 희안한 속성 이름들을 다 듣죠? ^^a

물론.. 그중 일부는 필자가 지은 것이지만.. ㅜ.ㅜ

이번은 중급 단계의 마지막 으로..

대표 속성에 대해 알아 보겠습니다.

대표 속성이란건..

말그대로 그 속성을 대표하는 속성이란 뜻이져.

무슨말인지 모르시겠죠? 저두 그래여.. ㅡ.ㅡa

(꼭.. 길이 기인 기린은 길이 기인 기린이고.. 뭐 이것처럼.. 이해가...ㆀ)

가령 예를 들어..

font라는 속성이 있죠?

여기에는 여러가지의 부가 속성이 따르는데..

대표적인 것이 family, weight, style등등이죠?

이걸 쓸땐 반드시 font-family:arial 이런식으로 뒤에 부가 속성을 달아 주어야 합니다.

그러나 대표 속성의 순서도를 외울 수 있다면 그냥 font:arial 이런식으루 쓸 수 있다는 것이죠.

그런데, 전 이 방법을 확실하게 권장함에도..

이 대표 속성 순서도를 외우는게 너무나 짜증이 나는 바람에.. ㅡ.ㅡa

왜냐하면 속성, 부가 속성, 속성값을 외우는 것만으로도 버겨운데..

이것까지 외운다고 생각 해 보세요.

좀 길게 적더라도 그냥 쓰고 말지..ㆀ

그래도.. 혹시나...

난 외우는거 자신있다~~!!

...라고 외치시는 분이 계시다면 전 박수를 치고 싶은 심정 입니다.

전 대표 속성 아는게 얼마 없거든요.

그럼에도 이걸 쓰길 권장하는 필자는 뭐냐구요?

이유는 말이죠.. 헷갈리지 않는다..는 것이랄까요?

왜 있잖아요..

윈도에서 그 수많은 파일들을..

종류별로 배치 하거나 폴더로 따로 묶어 두었을때의 그 깔끔함..

그런 깔끔함을 스타일 시트에서 느낄 수 있기 때문 이랄까요?

아무튼.. 이건 중요하기 때문에 싫든 좋든간에 전 강좌 씁니다..ㅡ.ㅡa

이거 읽기 싫으신 분들은 그냥 넘어 가셔두 전 상관 안합니다.

그러나 제가 이런 말을 할때 꼭 끼워 넣는말.

아시져? ^^

안보면 님만 손해란거..

▶대표 속성

▶대표 속성

대표 속성은 그냥.. 부가 속성별로 위치하는 곳을 외우기만 하면 됩니다.

가령 예를 들어 list-style같은 건..

list-style-type, list-style-position, list-style-image, 이렇게 3가지가 있죠?

그래서 이걸 대표 속성으로 바꾸면..

list-style:type position image

list-style 부가 속성의 위치가 이런식으로 나타납니다.

이건.. 님들이 임의로 지정 할 수 있는게 아니라..

W3C에서 그렇게 정한것이기 때문에..

여러분들은 아쉽지만 이걸 외우는 수밖에 달리 방법이 없습니다.

그리고, 대표 속성에 값을 넣을때도,

해당되는 부가 속성의 위치에다가 맞게 적어 넣어 주시면 되는 것이랍니다 ^^*

가령 예를들어..

list-style같은건..

list-style:type position image 순으로 되어 있잖아요?

그럼 여기다 값을 지정할땐 이렇게 되는 것이죠.

이해가 가시는지? ^^

그럼 대표 속성을 쓸때,

위의 것처럼 여러개를 한꺼번에 적용 시키는 것이 아니라,

한가지 이상씩 적용 시킬땐 어떻게 하는지 궁금 하실겁니다.

그럴땐, 적용 시킬 부가 속성의 값은 그대로 적어 주시구요,

나머지 적용 안시킬 값들은 모조리 기본값으로 해 두시면 되는 것이랍니다 *^^*

그리고, 어떤 님들은 그럼 그 적용 시키지 않을 값들을 그냥 적지 않고,

적용 시킬 값만 적으면 되지 않냐~

...라는 님이 게시는데요..

대표 속성엔 기본값이 없는 경우가 대반수 입니다.

그렇기 때문에 쓰지 않을 값들도.. 모두 써주는 동시에~

그것들을 모두 기본 값으로 만들어 주어야하는 불편함이..ㅜ.ㅜ

그래서 대표 속성을 잘 안쓰는 것일지도..

그래도 필요할땐 써야 되니...

제가 강좌 쓸때 그때 그때 일러 두도록 하죠 *^^*

그럼 아래는 님들이 지금까지 배우신 속성들의 대표 속성 입니다.

참고로 대표 속성이 존재하지 않는 속성들은 제외 시켰습니다.

그럼 즐작 되시구요..

전 고급 단계에서 다시 뵙겠습니다.

여러분 건강하세요 *^^*

▶대표 속성 도표

▶대표 속성 도표

font:style variant weight size family

background:color image repeat attachment position

list-style:type position image

- End -