初学菜鸟的html简录~
2018-04-19 本文已影响0人
koreyoshia
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="keywords" content="官方，原装">
<title>小仙女的网站</title>
</head>
<body bgcolor=#ba55d3 style="height:1500px">
<h1 align="center">123</h1>
<h2>123</h2>
</hr>
<h3>123</h3>
<p>HTML 是用来描述网页的一种语言。
HTML 指的是超文本标记语言 (Hyper Text Markup Language)
<blockquote> HTML 不是一种编程语言，而是一种标记语言</blockquote>
(markup language)
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页
<q>HTML 标签</q>
HTML 标记标签通常段落被称为 HTML 标签 (HTML tag)。
HTML <abbr>由尖括号包围的关键词</abbr>签是，比如
HTML 标签通常是成对出现的，比如 <b> 和 </b>
标签对中的第一个标签是开始标签，第二个标签是结束标签
开始和结束标签也被称为开放标签和闭合标签</p>
<a href="#123">查看标记段落</a>
<a href="http://www.hao.com" target="_blank">hao123</a>
<a href="./12.html" target="_blank">12</a>
<img src="logo.png" align="left" alt="标志" width="80" height="20" title="123">
<!--行级块元素（特殊）-->
<!--html标签语义化
1.方便开发人员维护
2.有利于seo（搜索引擎优化）
-->
<table border="2">
<tr>
<th>Heading</th>
<th>Another Heading</th>
</tr>
<tr>
<td>row= cell=</td>
</tr>
<tr>
<td>11</td><td>22</td>
</tr>
<tr>
<td>33</td><td>44</td>
</tr>
</table>
<table border="3" cellpadding="10" cellsapcing="15">
<tr>
<td>row=1 cell=2</td><!--th和td标签都要写在tr里面-->
</tr>
</table>
<ul type="disc"><!--无序列表-->
<li>12345 <a href="">链接</a></li>
</ul>
<ul type="circle"><!--无序列表-->
<li>12345 <a href="">链接</a>
<ol>
<li>1234567</li>
</ol>
</li>
</ul>
<ul type="square"><!--无序列表-->
<li>12345 <a href="">链接</a></li>
</ul>
<ol type="1">
<li>1234567</li>
</ol>
<ol type="A">
<li>1234567</li>
</ol>
<ol type="a">
<li>1234567</li>
</ol>
<!----order有序列表-->
<dl>
<dt>计算机</dt>
<dd>用来计算的仪器 ... ...</dd>
<dt>显示器</dt>
<dd>以视觉方式显示信息的装置 ... ...</dd>
</dl>
<b>This text is bold</b>
<br />
<strong>This text is strong</strong>
<br />
<big>This text is big</big>
<br />
<em>This text is emphasized</em>
”
<br />
<i>This text is italic</i>
<br />
<small>This text is small</small>
<br />
This text contains
<sub>subscript</sub>
<br />
This text contains
<sup>superscript</sup>
<pre>
这是
预格式文本。
它保留了 空格
和换行。
</pre>
<p>pre 标签很适合显示计算机代码：</p>
<pre>
for i = 1 to 10
print i
next i
</pre>
<address>
Written by <a href="mailto:webmaster@example.com">Donald Duck</a>.<br>
Visit us at:<br>
Example.com<br>
Box 564, Disneyland<br>
USA
</address>
这是长的引用：
<blockquote>
这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。
</blockquote>
这是短的引用：
<q>
这是短的引用。
</q>
<p>
使用 blockquote 元素的话，浏览器会插入换行和外边距，而 q 元素不会有任何特殊的呈现。
</p>
<p>一打有 <del>二十</del> <ins>十二</ins> 件。</p>
<p>大多数浏览器会改写为删除文本和下划线文本。</p>
<p>一些老式的浏览器会把删除文本和下划线文本显示为普通文本。</p>
<a href="11.html" target="_top">回顶部</a>
<div><!---->
布局 划分区块
</div>
<div><!---->
布局 <span style="color:#ff0883">划分区块</span> 块级元素
</div>
<span>
qwert 行级元素
</span>
<span>
qwert
</span>
<form action="表单，用于对后台提供数据，可以是地址等">
<div>
<label for="user name">
<!--input获取焦点,鼠标闪动-->
用户名:
<input id="user name" type="text"/>
</label>
<br/>
密码：
<input type="password"/>
<br/>
</div>
</form>
性别：
<input type="radio" name="sex"/>男
<input type="radio" name="sex" checked/>女<!--默认-->
<!--radio表示单选按钮；checkbox表示多选按钮；checked表示默认指定-->
爱好：
<input type="checkbox" name="hobby" />电影
<input type="checkbox" name="hobby"/>游泳
<input type="checkbox" name="hobby"/>篮球
<select name="后台" ><!--下拉框；name是用来给后台看的-->
<option value="1">北大</option>
<option value="林大">浙大</option>
<option value="2">南大</option><!--value用于后台提交数据-->
</select>
<button>按钮,或者可以input表示</button>
<input type="buton" onclick="">
<input type="submit" value="aa(提交按钮)"/>
<textarea name="qwqe" id=""abc cols="30" rows="10">qwfsdgbdhnfcn</textarea>
<!--用于输入文本，其大小可变-->
html5
<input type="number"/>
<!--数字可调-->
<input type="email"/>
<!--邮箱自动识别-->
<input type="date"/>
<!--日历框-->
<input type="color"/>
<!--提交颜色框-->
</body>
</html>
