HTML学习总结
2017-08-23 本文已影响26人
EldonZhao
HTML 指的是超文本标记语言 (Hyper Text Markup Language) 所谓的超文本就是指页面内可以包含图片、链接、甚至音乐，等非文字元素。
html示例：
<html>
<head>
<title>html example</title>
<script src="bower_components/jquery/dist/jquery.js"></script>
</head>
<body>
<h1>html body</h1>
<p>html paragraph</p>
</body>
</html>
html标签：
- 标签定义：标签就是上面这些< head>、< body>、< table> 等被尖括号“<”和“>”包起来的对象，绝大部分的标签都是成对出现的，如< table>< /talbe>、< form>< /form>。
-
<h1>~<h6>:标题heading； -
<p>:段落paragraph； -
<a>:链接； -
<img>:图片image； - ...
html元素：
- 元素定义：HTML 元素指的是从开始标签（start tag）到结束标签（end tag）的所有代码。
- 元素语法：
<p>eldonzhao</p> - 元素嵌套：
<body><p>eldonzhao</p></body> - 空元素：
<a></a>
<br/> vs <p></p>:
<br/>为换行标签，相当于回车；
<p></p>为段落标志，段落后空一行，相当于两个回车；
html属性：
- align：相对位置，居左、居中、居右等；
- bgcolor：背景颜色；
- ...
html文本格式化：
-
<b>:粗体bold； -
<big>:大号字体； -
<em>:强调emphasized； -
<i>:斜体italic； -
<small>:小号字体； -
<strong>:强壮字体； -
<pre>:块格式； - ...
html样式：
<body style="background-color:powderblue"></body>
style 提供了一种改变所有 HTML 元素的样式的通用方法。这里可以将，背景颜色，字体样式，字体尺寸，字体颜色，对齐方式一并定义好。
html链接：
- 给文字加链接：
<a href="www.shiyanlou.com">shiyanlou</a> - 给图片加链接：
<a href="www.taobao.com"></a> - 链接的打开方式：
<a href="www.baidu.com" target="_blank">百度</a>，_blank表示在新窗口打开链接，_self（默认）表示覆盖当前窗口； - 链接添加提示文字：
<a href="www.baidu.com" title="百度官网">百度</a>
html表格：
- table:表标签；
- tr:行标签；
- td:格标签；
- th:表头标签；
- caption:标题标签；
- cellpadding:单元格边距属性；
- bgcolor:背景颜色属性；
- background:背景图片属性；
- colspan:单元所占列数；
- rowspan:单元所占行数；
- border:边框粗细；
html图像：
- 设置网页背景图：
<body background="./coluslife.png"></body>； - 插入图片：
； - 设置图片属性：
； - 调整图片尺寸：
； - 创建图像映射：
<map name="lizi">
<area shape="rect" coords="50,10,100,60" href="img.html" target="_blank"
</map>
html列表：
- 有序列表：
<ol type="1">
<li>shiyanlou</li>
<ol>
- 无序列表：
<ul>
<li>shiyanlou</li>
</ul>
- 定义性列表：
<dl>
<dt>baidu</dt>
<dd>www.baidu.com</dd>
</dl>
html块：
<div></div>
<span></span>
