'css'에 해당되는 글 3건

  1. 2011.10.31 HTML & CSS z-index..!
  2. 2010.10.22 Flex ComboBox CSS...!
  3. 2009.11.04 CSS..!
카테고리 없음2011. 10. 31. 14:25

HTML & CSS z-index..!

HTML과 CSS를 하다보면 Style의 z-index라는 것을 볼수가 있다.

이 항목은 화면에서 보여지는 순서를 나타낸다.

숫자가 작은수록 아래에 깔리게 되며 숫자가 클 수록 화면의 위에 얹히게 된다.

<div id="layer2" style="....z-index:2;"></div>
<div id="layer4" style="....z-index:3;"></div>

두항 목중 어떤것이 위로 올라오게 될까..

숫자가 높은 layer4가 layer2보다 위에 올라오게 될것이다.

z-index를 이용하면 화면에 보여지는 순서를 정할 수 있다.
저작자표시
Posted by Z700zZz
Flex2010. 10. 22. 15:55

Flex ComboBox CSS...!

Flex에서 ComboBox에 CSS로 스타일 입히는 과정에서 알게 된 것...


ComboBox에 스타일을 줄려고 CSS에 속성등을 적어넣고 적용 시켰다.


이때 적용 하려했던건 font-family와 font-size...


.comboBox{

alternating-item-colors: white, #EEEEEE;

 font-family: "_sans";

 font-size: 11pt;

}


왜 적용이 안될까 하다가 찾아보니...


따로 지정을 해줘야 한다...



.filterComboBox{

alternating-item-colors: white, #EEEEEE;

drop-down-style-name: "comboBoxDropDownStyle";

text-input-style-name: "comboBoxTextInputStyle";

}


.comboBoxDropDownStyle{

font-family: "_sans";

font-size: 11pt;

}


.comboBoxTextInputStyle{

font-family: "_sans";

font-size: 11pt;

}


이런식으로 말이다.


drop-down-style-name 이건 ComboBox를 클릭시 밑에 나오는 리스트에 해당하는 스타일이고,


text-input-style-name는 일반 상태의 ComboBox에 해당하는 스타일이다.


그리고 한가지더 alternating-item-colors에 대한 설명...


ComboBox클릭시 리스트가 나오게 되는데 그 리스트에 줄마다 배경색을 달리 주고 싶을때 사용하는 속성이다.


두가지 이상의 색을 넣어주면 적용이 된다.

저작자표시

'Flex' 카테고리의 다른 글

Flex Button에 대하여..  (0) 2013.04.01
Flex DataGrid rowCount를 데이터의 갯수대로 생성하기.  (0) 2011.02.25
Flash Builder 컴파일 시 에러...!  (0) 2010.11.05
Flex의 ViewStack과 States...!  (0) 2010.10.28
Flex...ToggleButtonBar & ViewStack...!  (0) 2010.10.25
Posted by Z700zZz
CSS2009. 11. 4. 18:26

CSS..!

웹 페이지에 스타일을 넣는 CSS...!
오늘 배웠다.
오늘의 수업내용...

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">

<title>CSS Style</title>

<style type="text/css">

#div {background-color: RED ; font-size: 100px}   //div라는 id를 가진곳에 스타일을 적용시킨다.

#table {background-color: aqua ; font-size: 100px}

</style>


</head>


<body>

<div id="div">한글</div>

<div>Korean</div>


<table width="100" border="1">

<tr>

<td>Table</td>

</tr>

</table>

</body>

</html>


css에는 태그에 적용하는것과 id와 class에 적용하는것 세가지가 있다.


div {background-color: RED ; font-size: 100px}              div라는 태그에 스타일을 적용시킨다.

#div {background-color: RED ; font-size: 100px}             id가 div인곳에 스타일을 적용시킨다.

.div {background-color: RED ; font-size: 100px}             class가 div인곳에 스타일을 적용시킨다.


위의 코드에는 div 에 id가 div로 지정이 되어있다.

그러므로 스타일에 정의된 #div가 적용이 됐다.


태그에 적용을 하면 모든태그에 적용이 되고...

id나 class는 지정은 해줘야만 적용이된다.

id나 class모두 여러 곳에 적용이 가능하지만...id는 한곳에만 쓰도록하자.

규정상 그렇닿다..

나중에 JavaScript로 스타일을 바꾸는 경우가 생긴다면 id를 사용하여야 한다.

class는 정적이어서 변하지가 않는다.

css대충 이것만 알고 속성만 알면 끝인건가??

저작자표시
Posted by Z700zZz

티스토리툴바