본문 바로가기

ASP.NET

[ASP.NET] 테마(Themes) #2


이번엔 테마를 직접 사용해 보도록 하겠습니다.

CSS 사용하기

먼저 '테마'라는 파일 시스템 웹 사이트를 만들고 ex.aspx파일과 StyleSheet.css파일을 추가합니다.
CSS파일은 새 항목 추가 대화상자에서 '스타일 시트' 템플릿을 선택하면 쉽게 추가할 수 있습니다.

 이제 CSS를 사용한 예제를 살펴볼까요?


 

위 그림은 스타일시트를 지정해준 것 입니다.
boby안에 지정해준 스타일은 <body>태그 내부에 있는 문자 스타일입니다.
A는 <a>태그의 스타일을 지정한 것인데 A:link는 기본 링크 스타일, A:visited는 한 번이상 클릭 했을 시 스타일,
A:hover은 링크 위로 마우스를 올렸을 때의 스타일을 지정한 것 입니다.
Style1, Style2, Style3은 사용자가 임의로 지정한 스타일이죠.

이 스타일을 적용해봅시다!

 

 


<head>에 있는 <link href="StyleSheet1.css" rel="Stylesheet" type="text/css" /> 부분은 CSS를 link에 적용시키고자 할 때 적어줍니다.
 href에는 CSS파일 명을 지정해 주고 그외 rel과 type속성은 각각 참조할 개체와 타입을 지정하는 속성입니다.

이제 <body>로 넘어가 볼까요!
1. 은 어떤스타일도 지정해주지 않았지만 CSS에서 <body>태그 스타일을 정의하였으므로 <body>태크에 대한 스타일이 적용됩니다.
2. 에서는 링크를 걸어주었네요!! <a>태그에 대해 아까 CSS에서 link 스타일 정의해준 것을 적용할 수 있겠네요!
3.은 type을 text로 정해주었으므로 TextBox가 삽입되겠고 Class를 Style1로 지정해주었으므로 css의 style1이 TextBox의 Text에 적용되겠죠.
4. 에서는 CssClass 속성을 사용하여 CSS에서 정의한 Style2을 Label 컨트롤에 적용시킨 것 이네요. 
5.도 4와 같이 적용하고 Style3을 적용한거죠.



결과입니다.!!



'ASP.NET' 카테고리의 다른 글

[ASP.NET] 테마(Themes) #5  (0) 2012.01.17
[ASP.NET] 테마(Themes) #4  (0) 2012.01.17
[ASP.NET] 테마(Themes) #3  (0) 2012.01.17
[ASP.NET] 테마(Themes) #1  (0) 2012.01.17
[ADO.NET]DB연동-비연결기반 UPDATE  (0) 2012.01.17
[ADO.NET]DB연동-비연결기반 INSERT  (0) 2012.01.17
[ADO.NET] DB연동-비연결기반 SELECT  (0) 2012.01.17