<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>学习前端第一天</title>
</head>
<body>
<h1>前端结构</h1>
<!--
<!DOCTYPE html> 声明为 HTML5 文档
<html> 元素是 HTML 页面的根元素
<head> 元素包含了文档的元（meta）数据，如 <meta charset="utf-8"> 定义网页编码格式为 utf-8。
<title> 元素描述了文档的标题
<body> 元素包含了可见的页面内容
-->
<P>第一段落</P>
<!--
h1:元素定义一个大标签
p:元素定义一个段落
br:换行
-->
<!--注释-->
<h1>HTML</h1>
HTML 指的是超文本标记语言: HyperText Markup Language <br>
HTML 不是一种编程语言，而是一种标记语言<br>
标记语言是一套标记标签 (markup tag)<br>
HTML 使用标记标签来描述网页<br>
HTML 文档包含了HTML 标签及文本内容<br>
HTML文档也叫做 web 页面<br>
<h1>标签/元素</h1>
HTML 标签是由尖括号包围的关键词，比如 html<br>
HTML 标签通常是成对出现的，比如 b 和 /b<br>
标签对中的第一个标签是开始标签，第二个标签是结束标签<br>
开始和结束标签也被称为开放标签和闭合标签<br>
<h1>基础:</h1>
HTML 标题（Heading）是通过h1 - h6 标签来定义的
<h1>这是一个标题</h1>
<h2>这是一个标题</h2>
<h3>这是一个标题</h3>
<h4>这是一个标题</h4>
<h5>这是一个标题</h5>
<h6>这是一个标题</h6>
<h1>链接</h1>
HTML 链接是通过标签 a 来定义的。<br>
<a href="http://www.nowcoder.com">这是一个链接</a>
<h1>图像</h1>
HTML 图像是通过标签 img 来定义的。<br>
<img src="http://static.nowcoder.com/acm/images-acm/img/home/nk-head.png" /> <br>
图像的名称和尺寸是以属性的形式提供的。
<h1>属性</h1>
HTML 元素可以设置属性<br>
属性可以在元素中添加附加信息<br>
属性一般描述于开始标签<br>
属性总是以名称/值对的形式出现，比如：name="value"。<br>
使用小写属性 <br>
示例： <br>
HTML 链接由 a 标签定义。链接的地址在 href 属性中指定： <br>
<a href="http://www.nowcoder.com">这是一个链接</a>
<h1>水平线</h1>
hr> 标签在 HTML 页面中创建水平线，可用于分隔内容。
<p>这是一个段落。</p>
<hr>
<p>这是一个段落。</p>
<hr>
<p>这是一个段落。</p>
<h1>段落</h1>
段落是块级元素
<h2>折行</h2>
<p>这个<br>段落<br>演示了分行的效果</p>
br 元素是一个空的 HTML 元素。由于关闭标签没有任何意义，因此它没有结束标签。
<h1>文本格式化</h1>
<b>加粗文本</b><br>
<i>斜体文本</i><br>
<code>电脑自动输出</code><br>
这是 <sub> 下标</sub> 和 <sup> 上标</sup>
更多格式化标签 <br>
<a href="">牛客网</a>
<h1>头部</h1>
HTML title 元素
title> 标签定义了不同文档的标题。
title> 在 HTML/XHTML 文档中是必须的。
title> 元素:
定义了浏览器工具栏的标题
当网页添加到收藏夹时，显示在收藏夹中的标题
显示在搜索引擎结果页面的标题
HTML base> 元素
base> 标签描述了基本的链接地址/链接目标，该标签作为HTML文档中所有的链接标签的默认链接:
HTML link> 元素
link> 标签定义了文档与外部资源之间的关系。
link> 标签通常用于链接到样式表:
head>
link rel="stylesheet" type="text/css" href="mystyle.css">
/head>
HTML style> 元素
style> 标签定义了HTML文档的样式文件引用地址.
在style> 元素中你也可以直接添加样式来渲染 HTML 文档
<h1>样式css</h1>
CSS (Cascading Style Sheets) 用于渲染HTML元素标签的样式。
内嵌样式、内部样式、外部样式
<a href="">牛客网1.11</a>
<h4>字体、字体颜色、字体大小</h4>
<h1 style="font-family:verdana;">一个标题</h1>
<p style="font-family:arial;color:red;font-size:20px;">一个段落。</p>
<h4>文本对齐方式</h4>
<h1 style="text-align:center;">居中对齐的标题</h1>
<h1> 图片</h1>
<img src="URL" alt="替换文本" height="42" width="42">
<h1>样式 区块</h1>
<style type="text/css">
h1 {color:red;}
p {color:blue;}
</style>
<div>文档中的块级元素</div>
<span>文档中的内联元素</span>
<h1>无序列表</h1>
<ul>
<li>第一项</li>
<li>第二项</li>
</ul>
<h1>有序列表</h1>
<ol>
<li>第一项</li>
<li>第二项</li>
</ol>
<h1>自定义列表</h1>
<ol>
<li>第一项</li>
<li>第二项</li>
</ol>
<h1>表格</h1>
<table border="1">
<tr>
<th>表格标题</th>
<th>表格标题</th>
</tr>
<tr>
<td>表格数据</td>
<td>表格数据</td>
</tr>
</table>
</body>
</html>
07-31
07-24
267
267
07-28
64
64
07-24
577
577
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
