1. 首页
  2. 代码片断库
  3. HTML
全部数据
text
javascript
php
markdown
sh
java
python
html
csharp
css
sql
c_cpp
PHP
ruby
xml
scss
json
swift
JavaScript
typescript
vbscript
powershell
CSS
apache_conf
ActionScript 3
r
ini
HTML
golang

HTML jQuery选项卡模板默认

<div class="ui-tabs">
	<ul>
		<li><a href="#tabs-1">Nunc tincidunt</a></li>
		<li><a href="#tabs-2">Proin dolor</a></li>
		<li><a href="#tabs-3">Aenean lacinia</a></li>
	</ul>
	<div id="tabs-1">
		<p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
	</div>
	<div id="tabs-2">
		<p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
	</div>
	<div id="tabs-3">
		<p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p>
		<p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>
	</div>
</div>

HTML YUI模块HTML模板

<div class="yui-module">
  <div class="hd"></div> 
  <div class="bd"></div> 
  <div class="ft"></div> 
</div>

HTML YUI基页格式

<body>
  <div id=”doc”><!—-overall document wrapper-->
    <div id=”hd”><!--header / masthead--></div>
    <div id=”bd”><!--body--></div>
    <div id=”ft”><!--footer--></div>
  </div>
</body>

HTML DIV contentEditable属性支持Demo

<html>
<body>

<div id=d style="border: 1px solid black; height:200px">
lipsum
</div>
<button onclick="document.getElementById('d').contentEditable=true;">Make it editable</button>
</body>
</html>

HTML XHTML 1.0严格模板

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
	<title></title>
	<link rel="stylesheet" href="" type="text/css"></link>
</head>
<body>

</body>
</html>

HTML PáginaVersã1（软件livre）

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <title>Software Livre(Página Versão 1)</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body bgcolor="gray" text="navy" link="Silver" vlink="Lime" alink="white">
Software livre
Software livre, segundo a definição criada pela Free Software Foundation é qualquer programa de computador que pode ser usado, copiado, estudado e redistribuído sem nenhuma restrição. A liberdade de tais diretrizes é central ao conceito, o qual se opõe ao conceito de software proprietário, mas não ao software que é vendido almejando lucro (software comercial). A maneira usual de distribuição de software livre é anexar a este uma licença de software livre, e tornar o código fonte do programa disponível.

Um software é considerado como livre quando atende aos quatro tipos de liberdade para os usuários do software definidas pela Free Software Foundation:

a)A liberdade para executar o programa, para qualquer propósito (liberdade nº 0);
b)A liberdade de estudar como o programa funciona, e adaptá-lo para as suas necessidades (liberdade nº 1). Acesso ao código-fonte é um pré-requisito para esta liberdade;
c)A liberdade de redistribuir, inclusive vender, cópias de modo que você possa ajudar ao seu próximo (liberdade nº 2);
d)A liberdade de modificar o programa, e liberar estas modificações, de modo que toda a comunidade se beneficie (liberdade nº 3). Acesso ao código-fonte é um pré-requisito para esta liberdade;
</body>
</html>

HTML 使用CSS设置HR标记

<style>
div.hr {
  height: 15px;
  background: #fff url(hr1.gif) no-repeat scroll center;
}

div.hr hr {
  display: none;
}
<style>


<div class="hr"><hr /></div>

HTML HTML文档设置

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-AU">
<head>

HTML 标准和政府元数据

<!-- ============== STANDARD METADATA ==================================== -->
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
		<meta name="language" content="en-AU" />
		<meta name="title" content="[[insert page title]]" />
		<meta name="description" content="[[insert appropriate description here]]" />

		<meta name="keywords" content="government schooling highschool education south australia [[insert appropriate tags here]]" />
		<meta name="author" content="Department of Education and Children's Services South Australia" />
		<meta name="Robots" content="index, follow" />

<!-- ============== GOVERNMENT METADATA ================================== -->
		<meta name="DC.Format" scheme="imt" content="text/html" /> 
		<meta name="DC.Type" content="text.homepage.organizational" />

		<meta name="DC.Title" content="[[insert page title]]" /> 
		<meta name="DC.Description" content="[[insert appropriate description here]]" /> 
		<meta name="DC.Subject" content="government schooling highschool education south australia [[insert appropriate tags here]]" /> 
		<meta name="DC.Identifier" scheme="URI" content="http://www.decs.sa.gov.au" /> 
		<meta name="DC.Creator.corporateName" content="Department of Education and Children's Services South Australia" /> 
		<meta name="DC.Publisher.corporateName" content="Government of South Australia" /> 
		<meta name="DC.Rights" scheme="URI" content="http://www.sa.gov.au/copyright.html" /> 
		
		<meta name="DC.Date.created" scheme="ISO8601" content="2009-01-01" />
		<meta name="DC.Date.modified" scheme="ISO8601" content="2009-07-30" /> 
		
		<meta name="DC.Date.valid" scheme="ISO8601" content="2009-01-01 / 2010-30-07" />
		
		<meta name="DC.Language" scheme="RFC3066" content="en-AU" /> 
		<meta name="DC.Relation.hasVersion" content="1" />
		<meta name="DC.Coverage.jurisdiction" scheme="AglsJuri" content="South Australia" /> 
		<meta name="AGLS.Audience" scheme="agls-audience" content="all" /> 
		<meta name="AGLS.Availability" content="address=GPO Box 1152,ADELAIDE SA 5001;contact=Phone(08) 8226 1000;email=decscustomers@saugov.sa.gov.au;website=http://www.decs.sa.gov.au;" /> 

		<link rel="schema.DC" href="http://purl.org/dc/elements/1.1/" /> 
		<link rel="schema.AGLS" href="http://www.naa.gov.au/recordkeeping/gov_online/agls/1.2/" />

HTML 标准文档头设置

<title></title>

<!-- ============== ATOM FEED ============================================ -->
	<link rel="alternate" type="application/atom+xml" title="" href="" />

<!-- ============== FAVOURITES ICON ====================================== -->
	<link rel="shortcut icon" href="" type="image/x-icon" />

<!-- ============== STYLE SHEETS ========================================= -->
	<link rel="stylesheet" media="screen" href="" type="text/css" />
	<link rel="stylesheet" media="print" href="" type="text/css"  />
	<link rel="stylesheet" href="" type="text/css" id="smallscreen" />
	
<!-- ============== JAVASCRIPT =========================================== -->
	<script type="text/javascript" src=""></script>

<!-- ============== WEB SERVICE METADATA ================================= -->
		<meta name="" content="" />
		<meta name="" content="" />

<!-- ============== 3RD PARTY TOOLS ====================================== -->
	<link href="" rel="Stylesheet" type="text/css" />
	<script src="" type="text/javascript"></script>