在我看来,学习前端首先要了解并学习一下前端"三剑客",前端"三剑客"包括:HTML,CSS,JAVAScript。今天我先来介绍一下我是如何学习HTML及相关知识点。 HTML(Hyper Text Markup Language--超文本标记语言)
html概述
HTML是 HyperText Mark-up Language 的首字母简写,意思是超文本标记语言,超文本指的是超链接,标记指的是标签,是一种用来制作网页的语言,这种语言由一个个的标签组成,用这种语言制作的文件保存的是一个文本文件,文件的扩展名为html或者htm,一个html文件就是一个网页,html文件用编辑器打开显示的是文本,可以用文本的方式编辑它,如果用浏览器打开,浏览器会按照标签描述内容将文件渲染成网页,显示的网页可以从一个网页链接跳转到另外一个网页。
如何学习:
我是通过在b站观看相关视频,然后按照学习进度敲代码巩固学习。 接下来就是我学习到的知识点总结。
知识点
我的第一个HTML代码
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
hello world!
</body>
</html>
注释:
HTML的标签是和其他语言的注释不一样的,要使用标签来进行注释。其格式为<!-注释内容-->,另外需要注意的是这个注释是不可以嵌套使用的。
标题
有六种标题,从h1-h6字体会逐渐变小。
段落
<p> 段落</p>
格式化标签
<strong>加粗</strong>
<b>加粗</b>
<em>倾斜</em>
<i>倾斜</i>
<del>删除线</del>
<s>删除线</s>
<ins>下划线</ins>
<u>下划线</u>
图片标签
图片标签img是一个单标签,在img里面可以写很多属性,例如src描述图片具体的位置,这个路径可以是绝对路径也可以是相对路径,alt表示如果图片不能显示就会显示这个提示信息,title表示这张图片的标题,当光标滑到图片上就会提示, width宽height高,这可以设置图片的尺寸。
超链接标签:
a标签,href 表示一个正确的地址,a标签是行内元素
列表标签:
<h3>无序列表</h3>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<h3>有序列表</h3>
<ol>
<li>1</li>
<li>2</li>
<li>3</li>
</ol>
<h3>自定义列表</h3>
<dl>
<dt>自定义标题</dt>
<dd>1</dd>
<dd>2</dd>
<dd>3</dd>
</dl>
表格标签:
table表示整个表格,tr表示一行,td表示一列,th表示表头中的一列.
表单标签:
input是这里面最常使用的,type表示要输入的框架类型,包括文本框:text、密码框:password、单选框:radio、复选框:checkbox、按钮:button、选择文件:file等