HTML学习
2019-02-16 本文已影响0人
小传奇_2681
简介
什么是HTML？
- HTML：超文本标记语言 (Hyper Text Markup Language)
- HTML是一种标记语言（markup language），标记语言是一套标记标签（markup tag）组成的
- HTML使用标记标签来描述网页
HTML标签
- 尖括号包围关键词，如<html>
- 标签成对出现，如<b>和</b>
- 第一个和第二个对应开始标签（开放标签）和结束标签（闭合标签）
HTML文档=网页
HTML文档包含HTML标签和纯文本
例子：
<html>
<body>
<h1>my first heading</h1>
<p>my first phatograph</p>
</body>
</html>
编辑
右击新建文本文档（记事本）
编辑代码 - 另存为 xxxx.html - 打开这个
会出现类似效果
image
链接
< a href="链接“>描述</ a>
- 链接用<a>标签进行定义
- 注意：href="http://链接"
- 在 href 属性中指定链接的地址
元素
- 元素的内容是开始标签与结束标签之间的内容
- 大多数HTML元素是嵌套结构
- 没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。
在开始标签中添加斜杠，比如 <br />，是关闭空元素的正确方法，HTML、XHTML 和 XML 都接受这种方式。 - 建议使用小写标签（相较于<P>使用<p>）
HTML属性
- 属性为HTML元素提供附加信息
- 属性总是以名称/值对的形式出现，比如：name="value"
- 属性总是在HTML元素的开始标签中规定的
- 始终为属性值加引号
HTML标题
标题级别：
<h1>一级标题</h1>
<h2>二级标题</h2>
直到<h6>六级标题</h6>
tip：仅仅使用在标题中，粗体文本可使用其他标签或CSS
标题居中
<h1 style="text-align:center">标题内容</h1>
HTML水平线
标签在HTML页面中创建水平线，用于分割内容。
如：
<p>A paragraph</p>
<hr/>
<p>this is a paragraph</p>
<hr/>
<p>as the same</p>
代码注释
`` 注释内容不会显示
查看源代码
右击——查看源文件/查看页面源代码
段落
<p>段落文本</p>
段落元素由 p 标签定义
空行：插入<br/>标签
拆行
<p>This is <br/>a para<br/>graph with line beraks</p>
Tips:不要在源代码中连续空格/空行
格式化
文本格式化
粗体：<b>this text is bold</b>
斜体：<em>this text is emphasized</em>
<i>this text is italic</i>
表单<form>
输入框 input type="text"
<form>
First name:<br/>
<input type="text" name="firstname">
<br/>
</form>
单选按钮 <input type="radio">
<form>
<input type="radio" name="sex" value="male">Male
<br/>
<input type="radio" name="sex" value="female">Female
</form>
多选按钮<input type="checkbox">
<form>
<input type="checkbox" name="xxxx" value="xxxx">走中国特色社会主义道路
<br/>
<input type="checkbox" name="xxxx" value="xxxx">我爱我家
<br/><br/>
</form>
按钮 <button>
<button type="button">Submit</button>
大输入框
<textarea>
列表
无序列表<ul>
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
显示为：
- Coffee
- Milk
有序列表<ol>
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
显示为：
- Coffee
- Milk
