웹표준,웹접근성(html, html5, css, css3, javascript, jQuery, jQueryMobile, snecha, senchaTouch, php, mobileWebApp)

화면 표시 모듈 - display 본문

css

화면 표시 모듈 - display

jokack01 2011. 11. 11. 10:02

<!DOCTYPE html>
<html lang="ko">
<head>
 <meta charset="utf-8">
 <title>화면 표시 모듈 - display</title>
 <style type="text/css">
  .none {
   display: none;
  }
  
  .trans {
   opacity: 0; /* 투명, 영역유지, 버튼 클릭 가능 */
  }

  .visible {
   visibility: visible;
  }
  
  .hidden {
   visibility: hidden;
  }

 </style>
</head>
<body>
 
 <ul>
  <li><a class="none" href="http://m.daum.net">mobile daum</a></li>
  <li><a class="hidden" href="http://m.naver.com">mobile naver</a></li>
  <li><a class="trans" href="http://m.nate.com">mobile nate</a></li>
 </ul>
 
 <div class="table">
  <div class="list-item">not list item, It's Div</div>
  <div class="list-item">not list item, It's Div</div>
 </div>
 
 
 <table summary="테이블 요약" border="1">
  <caption>테이블 제목</caption>
  <tr><th>테이블 셀 제목</th></tr>
  <tr><td>테이블 셀 내용</td></tr>
 </table>
 
 <ul>
  <li><span class="inline">list</span> item</li>
  <li>list item</li>
  <li>list item</li>
 </ul>
 
 <ol>
  <li>list item</li>
  <li>list item</li>
  <li>list item</li>
 </ol>

</body>
</html>

'css' 카테고리의 다른 글

플로팅 디자인의 특징  (0) 2011.11.11
플로팅된 자식요소를 감싸 안으려면?</  (0) 2011.11.11
out-line  (0) 2011.11.11
min,max height  (0) 2011.11.11
media type  (0) 2011.11.11