正式学习前端第一波
HTML
描述:
HTML 是用来描述网页的一种语言。
- HTML 指的是超文本标记语言 (Hyper Text Markup Language)
- HTML 不是一种编程语言,而是一种标记语言 (markup language)
- 标记语言是一套标记标签 (markup tag)
- HTML 使用标记标签来描述网页
基本格式:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>标题</title>
</head>
<body>
<h1>这是个标题</h1>
<p>这是一个段落</p>
</body>
</html>
- <html> 与 </html> 之间的文本描述网页,开始与结束位置
- <body> 与 </body> 之间的文本是可见的页面内容,主题内容
- <h1> 与 </h1> 之间的文本被显示为标题,由大到小逐次递减<h1>---><h6>
- <p> 与 </p> 之间的文本被显示为段落
HTML链接标签<a>:
<a href="xxx.html">This is a link</a>
HTML图像标签<img>:
<img src="xxx.jpg" width="104" height="142" />
HTML水平线标签<hr>(不常用):
<hr />
HTML注释:
<!-- -->
HTML折行:
在不产生新的段落的情况下换行的一种方法
<br />
改变样式<style>(主要可以在css中改变,在这里仅作了解):
通过 HTML 样式,能够通过使用 style 属性直接将样式添加到 HTML 元素,或者间接地在独立的样式表中(CSS 文件)进行定义。
<style>中的属性:
text-align:定义文本的对齐方式,center 居中
background-color:定义背景颜色
font-family:定义字体系列
color:定义文本颜色
font-size:定义字体的尺寸
等。。。
文本格式化标签:
标签 | 描述 |
---|---|
<b> | 定义粗体文本。 |
<big> | 定义大号字。 |
<em> | 定义着重文字。 |
<i> | 定义斜体字。 |
<small> | 定义小号字。 |
<strong> | 定义加粗(加重语气)。 |
<sub> | 定义下标字。 |
<sup> | 定义上标字。 |
<ins> | 定义插入字。 |
<del> | 定义删除字。 |
HTML表格:
<table border="1" title="表格"> <!-- border 边框的宽度 -->
<caption>表格</caption> <!--caption 表格标题 -->
<thead align="center"> <!-- thead 表格的页眉部分 -->
<tr> <!-- tr 表格的 “行” -->
<th>姓名</th> <!-- th 表头中的“列” -->
<th>学号</th>
<th>密码</th>
</tr>
</thead>
<tbody align="center"> <!-- 表格的数据主体部分 -->
<tr>
<td>魏璐闯</td> <!-- th 表格主题中的“列” -->
<td>161360113</td>
<td>123456</td>
</tr>
<tr>
<td>史少波</td>
<td>161360116</td>
<td>123456</td>
</tr>
</tbody>
<tfoot> <!-- 表格的页脚部分 -->
<tr>
<td>?</td>
<td>??</td>
<td>???</td>
</tr>
</tfoot>
</table>
HTML列表:
哎~自己看吧,我感觉ennmmm还可以都能看懂就不一个一个注释了
<div>
<ul>
<h3>这是无序列表</h3>
<li><a href="text.html" title="标题">无序列表项1</a></li>
<li><a href="text.html" title="标题">无序列表项2</a></li>
<li><a href="text.html" title="标题">无序列表项3</a></li>
</ul>
<ol>
<h3>这是有序列表</h3>
<li><a href="text.html" title="标题">有序列表项1</a></li>
<li><a href="text.html" title="标题">有序列表项2</a></li>
<li><a href="text.html" title="标题">有序列表项3</a></li>
</ol>
<dl>
<h3>这是一个自定义列表</h3>
<dt>啥1</dt>
<dd><a href="text.html">不知道1_1</a></dd>
<dd><a href="text.html">不知道1_2</a></dd>
<dt>啥2</dt>
<dd><a href="text.html">不知道2_1</a></dd>
<dd><a href="text.html">不知道2_2</a></dd>
</dl>
</div>
顺便分享一下自学的主要来源,想学的可以去逛一下,感觉是很良心的一个网站:
http://www.w3school.com.cn/html/index.asp