블로그 이미지
Magic_kit
study 관련자료를 한곳으로 자기 개발 목적으로 재태크 재무 관리 목적으로 일상생활의 팁을 공유 하기 위하여 블로그를 개설 하였습니다.

calendar

 «  » 2024.5
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
반응형

Category

Recent Post

Recent Comment

Archive

'.Net Project/CSS 2.0'에 해당되는 글 23건

  1. 2009.07.28 11장 SortStyle
  2. 2009.07.28 10장 FontStyle
  3. 2009.07.27 09장 영역설정 태그
  4. 2009.07.27 08장 중첩 태그
2009. 7. 28. 10:06 .Net Project/CSS 2.0

11장 SortStyle

반응형

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"           
                                 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <title>11.정렬관련태그</title>
</head>

<body>
 <table border="1" style="width:200px;height:200px;">
 
 <tr>
     <td align="center">
          1 <br />
          1 <br />
    </td>

<!--  줄간격을 line-height:150% 넓이고자 할대 사용한다 -->
     <td style="text-align:center; line-height:200%">
          2<br />2<br />
     </td>
 </tr>
 
 <tr>
  <!--글자하나의 간격을 <em : 해당 범위에서의 폰트의 높이를 1로 하는 단위
                                                    etter-spacing 나타내어 표현>-->
  <!--letter-spacing 문자간격-->
      <td align="right";valign="top" style="letter-spacing:0.5em;">
           33
      </td>
  
  <!--ertical-align 수직정렬 의미하며, Top Left Right Bottom Center Middle
                                                    항상 기억(순서는 좌상우하) -->
  <!--word-spacing 단어 간격을 표현-->

      <td style="text-align:right;vertical-align:bottom;word-spacing:1em;">
           44 44
      </td>
  </tr>
 
</table>

</body>
</html>

반응형

'.Net Project > CSS 2.0' 카테고리의 다른 글

13장 여백관련Style  (0) 2009.07.28
12장 TextStyle  (0) 2009.07.28
10장 FontStyle  (0) 2009.07.28
09장 영역설정 태그  (0) 2009.07.27
08장 중첩 태그  (0) 2009.07.27
posted by Magic_kit
2009. 7. 28. 10:01 .Net Project/CSS 2.0

10장 FontStyle

반응형



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  
                              "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>10.폰트 관련 스타일 </title>
 <style type="text/css">
       
        body 태그 안에  Font속성을 지정
        body { color:Blue;font-size:10pt;font-family:Verdana;}  
      
        boldText,boldText1 글자속성을 볼드체로 변경
       .boldText{font-weight:bold;}
       .boldText1{font-weight:bold;}
 
       italic Text, italic Text1 글자속성을 이텔릭체로 변경
       #italicText{font-style:italic;}
       #italicText1{font-style:italic;}
 
       Text 의 글자 속성을 취소선으로 변경
      .strikeText{text-decoration:line-through;}
</style>

</head>

<body>
 글자 모양 관련 3가지 : 색상, 크기, 글꼴 <br />
 
 <!--1.볼드체 표현 방식(굵게)-->
 <span class="boldText">볼드체</span><br />
 <b class="boldText1">볼드체</b> <br />
 
 <!--2.이텔릭체 표현 방식(기울임)-->
 <i id="italicText1">이텔릭체</i> <span id="italicText">이텔릭체</span><br />
 
 <!--3.태그를 직접 넣어서 밑줄 문자 표현-->
 <u>밑줄</u> <span style="text-decoration:underline;">밑줄</span> <br />
 
 <!--4.점 클래스를 이용하여 취소선을 표시하는 방법 위에 선언할때overline 역시 같이
                                                                                              표현 가능 -->
 <s>취소선</s> <strike>취소선2</strike> <span class="strikeText">취소선3</span> 

</body>
</html>

반응형

'.Net Project > CSS 2.0' 카테고리의 다른 글

12장 TextStyle  (0) 2009.07.28
11장 SortStyle  (0) 2009.07.28
09장 영역설정 태그  (0) 2009.07.27
08장 중첩 태그  (0) 2009.07.27
07장 중첩 클래스  (0) 2009.07.27
posted by Magic_kit
2009. 7. 27. 15:08 .Net Project/CSS 2.0

09장 영역설정 태그

반응형


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>09.영역설정태그(영역/박스/레이어)</title>
  
  <style type="text/css">
  #main {color:Black;}
  #notice{font-size:9pt;}
  .title{font-weight:bold;}
  .content{margin-left:-20px;}
    </style>
 <!--.content{margin-left:020px;padding:0px;}-->
</head>


<!--div태그는 전체 영역을 설정(레이어)
span태그는 웹 브라우저 텍스트 영역만 설정(특정부분 텍스만 사용시)-->
<body>

안녕하세요 <div style="width:100px; color:Green; background-color:Yellow;">반갑습니다 </div> 또 만나요.

<hr />

안녕하세요 .<span style="color:Red;">반갑습니다</span> 또 만나요.

<hr />

<div id = "main">
 <div id = "notice">
  <div class="title">공지사항
  <div class="content">
   <ul>
    <li> Visual Web Developer 2008설치 </li>
    <li> SQL Server 2008 설치 </li>
   </ul>
  </div>
  </div>
</div>

 </body>
</html>


반응형

'.Net Project > CSS 2.0' 카테고리의 다른 글

11장 SortStyle  (0) 2009.07.28
10장 FontStyle  (0) 2009.07.28
08장 중첩 태그  (0) 2009.07.27
07장 중첩 클래스  (0) 2009.07.27
06장 우선순위  (0) 2009.07.27
posted by Magic_kit
2009. 7. 27. 15:02 .Net Project/CSS 2.0

08장 중첩 태그

반응형



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>8.중첩태그</title>
<!--    중첩 태그 사용하여 CSS2.0 꾸미기 기법-->
   
   <style type="text/css">
    h3 em{color:Red;} <h3> -> <em> 포함된 CSS2.0 Font Color 속성 변경
  </style>

</head>
<body>
 
 <h3>HTML</h3>
 
 <h1>CSS</h1>
 <em>CSS</em>
 <h3>오늘은 <em> CSS2.0 </em>배우는 시간 </h3> 특정영역 Font 속성 변경
 <h1>오늘은 <em> CSS2.0 </em>배우는 시간 </h1>

</body>
</html>


반응형

'.Net Project > CSS 2.0' 카테고리의 다른 글

10장 FontStyle  (0) 2009.07.28
09장 영역설정 태그  (0) 2009.07.27
07장 중첩 클래스  (0) 2009.07.27
06장 우선순위  (0) 2009.07.27
05장 ID 속성값  (0) 2009.07.27
posted by Magic_kit
prev 1 2 3 4 5 6 next

티스토리툴바