advanced code snippet search

Posted By

masaya on 01/14/07


Tagged

css template html xhtml


Versions (?)

Who likes this?

3 people have marked this snippet as a favorite

basicmagic
1976dan
oamaxa


XHTML basic template (ja/utf-8)

 / Published in: HTML
 

URL: http://masaya-sugawara.com/

各種CSSファイル(master.css, base.css, content.css, hack.css)と合わせて参考にどうぞ. 文字サイズを変更してもレイアウトを保ちます(フッター箇所の3カラム除く). また, メインエリアの画像は文字サイズの拡大縮小に応じてリサイズするようにしてあります.

Expand | Embed | Plain Text 
  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  3.     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja" dir="ltr">
  5. <head>
  6. 	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  7. 	<meta http-equiv="Content-Language" content="ja" />
  8. 	<meta http-equiv="Content-Style-Type" content="text/css" />
  9. 	<meta http-equiv="Content-Script-Type" content="text/javascript" />
  10. 	<meta http-equiv="pragma" content="no-cache" />
  11. 	<meta http-equiv="cache-control" content="no-cache" />
  12. 	<meta http-equiv="expires" content="0" />
  13. 	<meta http-equiv="imagetoolbar" content="false" />
  14.  
  15. 	<title>XHTML basic template</title>
  16.  
  17. 	<meta name="robots" content="FOLLOW" />
  18. 	<meta name="googlebot" content="index,follow" />
  19. 	<meta name="description" content="" />
  20. 	<meta name="keywords" content="" />
  21. 	<meta name="copyright" content="" />
  22. 	<meta name="MSSmartTagsPreventParsing" content="true" />
  23. 	<meta name="author" content="" />
  24.  
  25. 	<link rel="start" href="" title="" />
  26. 	<link rel="shortcut icon" href="favicon.ico" />
  27. 	<link rel="icon" type="image/png" href="favicon.png" />
  28. 	<link rel="stylesheet" type="text/css" media="screen,projection" href="c/master.css" charset="UTF-8" />
  29.  
  30. 	<script type="text/javascript" src="j/common.js" charset="UTF-8"></script> 
  31. </head>
  32. <body>
  33. <noscript>
  34. 	<div id="warning">
  35. 		<h2>当サイトを正しく表示するには JavaScript が必要です. 設定をオンにしてからページをロードし直してください.</h2>
  36. 	</div>
  37. </noscript>
  38. <!-- head -->
  39. <div id="head">
  40. 	<!-- Container -->
  41. 	<div class="Container">
  42. 		<h1><a href="/" title="XHTML basic template">XHTML basic template</a></h1>
  43. 		<p>made by <a href="http://masaya-sugawara.com" title="masaya-sugawara.com">masaya-sugawara.com</a></p>
  44. 	</div>
  45. 	<!-- / Container -->
  46. </div>
  47. <!-- / head -->
  48.  
  49. <hr />
  50.  
  51. <!-- nav -->
  52. <div id="nav">
  53. 	<!-- Container -->
  54. 	<div class="Container">
  55. 		<ul>
  56. 			<li><a href="/" title="Menu">Menu</a></li>
  57. 			<li><a href="/" title="Menu">Menu</a></li>
  58. 			<li><a href="/" title="Menu">Menu</a></li>
  59. 			<li><a href="/" title="Menu">Menu</a></li>
  60. 			<li><a href="/" title="Menu">Menu</a></li>
  61. 			<li><a href="/" title="Menu">Menu</a></li>
  62. 		</ul>
  63. 	</div>
  64. 	<!-- / Container -->
  65. </div>
  66. <!-- / nav -->
  67.  
  68. <hr />
  69.  
  70. <!-- content -->
  71. <div id="content">
  72. 	<!-- Container -->
  73. 	<div class="Container">
  74. 		<!-- main -->
  75. 		<div id="main">
  76. 			<!-- Container -->
  77. 			<div id="sample1" class="Container">
  78. 				<h2>Main Title</h2>
  79. 				<p><a href="http://www.flickr.com/photos/97799173@N00/337290746/" title=""><img src="http://farm1.static.flickr.com/154/337290746_b24ece3425_o.jpg" width="" height="" alt="" /></a><br />
  80. 				Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text. Text text text text text text text text text.</p>
  81. 				<h3>Sub Title</h3>
  82. 				<p>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text.</p>
  83. 				<p>Text text text text text text text. Text text text text text text text text text text text text .</p>
  84. 			</div>
  85. 			<!-- / Container -->
  86.  
  87. 			<hr />
  88.  
  89. 			<!-- Container -->
  90. 			<div id="sample2" class="Container">
  91. 				<h6>h6—XHTML basic template</h6>
  92. 				<h5>h5—XHTML basic template</h5>
  93. 				<h4>h4—XHTML basic template</h4>
  94. 				<h3>h3—XHTML basic template</h3>
  95. 				<h2>h2—XHTML basic template</h2>
  96. 				<h1>h1—XHTML basic template</h1>
  97. 				<h1>h1—XHTML basic template</h1>
  98. 				<h2>h2—XHTML basic template</h2>
  99. 				<h3>h3—XHTML basic template</h3>
  100. 				<h4>h4—XHTML basic template</h4>
  101. 				<h5>h5—XHTML basic template</h5>
  102. 				<h6>h6—XHTML basic template</h6>
  103. 			</div>
  104. 			<!-- / Container -->
  105. 		</div>
  106. 		<!-- / main -->
  107.  
  108. 		<hr />
  109.  
  110. 		<!-- sub -->
  111. 		<div id="sub">
  112. 			<!-- Container -->
  113. 			<div class="Container">
  114. 				<h4>Sub Title</h4>
  115. 				<ul>
  116. 					<li><a href="/" title="Link Text">Link Text</a></li>
  117. 					<li><a href="/" title="Link Text">Link Text</a></li>
  118. 					<li><a href="/" title="Link Text">Link Text</a></li>
  119. 					<li><a href="/" title="Link Text">Link Text</a></li>
  120. 					<li><a href="/" title="Link Text">Link Text</a></li>
  121. 				</ul>
  122. 			</div>
  123. 			<!-- / Container -->
  124.  
  125. 			<!-- Container -->
  126. 			<div class="Container">
  127. 				<h4>Sub Title</h4>
  128. 				<ul>
  129. 					<li><a href="/" title="Link Text">Link Text</a></li>
  130. 					<li><a href="/" title="Link Text">Link Text</a></li>
  131. 					<li><a href="/" title="Link Text">Link Text</a></li>
  132. 				</ul>
  133. 			</div>
  134. 			<!-- / Container -->
  135.  
  136. 			<!-- Container -->
  137. 			<div class="Container">
  138. 				<h4>Sub Title</h4>
  139. 				<p>Text text text text text text text text text text text text text text text text text text text text. Text text text text text text text text text text.</p>
  140. 			</div>
  141. 			<!-- / Container -->
  142. 		</div>
  143. 		<!-- / sub -->
  144. 	</div>
  145. 	<!-- / Container -->
  146. </div>
  147. <!-- / content -->
  148.  
  149. <hr />
  150.  
  151. <!-- extra -->
  152. <div id="extra">
  153. 	<!-- Container -->
  154. 	<div class="Container">
  155. 		<!-- e1 -->
  156. 		<div id="e1">
  157. 			<h5>Extra Title</h5>
  158. 			<p>Text text text text text text text text text text text text text text text. Text text text text text text text text text text text text text text text.</p>
  159. 		</div>
  160. 		<!-- / e1 -->
  161.  
  162. 		<!-- e2 -->
  163. 		<div id="e2">
  164. 			<h5>Extra Title</h5>
  165. 			<p>Text text text text text text text text text text text text text text text. Text text text text text text text text text text text text text text text.</p>
  166. 		</div>
  167. 		<!-- / e2 -->
  168.  
  169. 		<!-- e3 -->
  170. 		<div id="e3">
  171. 			<h5>Extra Title</h5>
  172. 			<p>Text text text text text text text text text text text text text text text. Text text text text text text text text text text text text text text text.</p>
  173. 		</div>
  174. 		<!-- / e3 -->
  175. 	</div>
  176. 	<!-- / Container -->
  177. </div>
  178. <!-- / extra -->
  179.  
  180. <hr />
  181.  
  182. <!-- foot -->
  183. <div id="foot">
  184. 	<!-- Container -->
  185. 	<div class="Container">
  186. 		<p>
  187. 			<!--Creative Commons License--><a rel="license" href="http://creativecommons.org/licenses/by/2.1/jp/"><img alt="Creative Commons License" style="border-width: 0" src="http://i.creativecommons.org/l/by/2.1/jp/88x31.png"/></a><br/>This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by/2.1/jp/">Creative Commons Attribution 2.1 Japan License</a>.<!--/Creative Commons License--><!-- <rdf:RDF xmlns="http://web.resource.org/cc/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:rdfs="http://www.w3.org/2000/01/rdf-schema#">
  188. 				<Work rdf:about="">
  189. 					<license rdf:resource="http://creativecommons.org/licenses/by/2.1/jp/" />
  190. 				</Work>
  191. 				<License rdf:about="http://creativecommons.org/licenses/by/2.1/jp/"><permits rdf:resource="http://web.resource.org/cc/Reproduction"/><permits rdf:resource="http://web.resource.org/cc/Distribution"/><requires rdf:resource="http://web.resource.org/cc/Notice"/><requires rdf:resource="http://web.resource.org/cc/Attribution"/><permits rdf:resource="http://web.resource.org/cc/DerivativeWorks"/></License></rdf:RDF> -->
  192. 		</p>
  193. 	</div>
  194. 	<!-- / Container -->
  195. </div>
  196. <!-- / foot -->
  197. </body>
  198. </html>

Report this snippet  

You need to login to post a comment.