在很多时候,我都想写一些入门的东西,今天全是干货!文字:2273,请大家用心阅读这篇知识点归纳。整理不易。
我们先来说一说有限性和无限性。我们在学习web前端,最基础要把html和css全部掌握吧,其实知识点是有限的,但是知识点结合变化就是无限的。html是骨架,css是衣服,鲜活的人最基础的东西。大家可以想一个人穿着不同的衣服,就是css样式的多样化,我们不同的人穿着同样的衣服,就是html的多样化,所以,我们很多时候后在学习的过程中,都只学会了知识,并没有灵活的使用,用一个简单的例子,来描述我的言语:一个div用一个属性显示不同颜色的衣服,不同大小的块,穿着同样的衣服。web这个技术,入门容易,很容易找到成就感但是想要学深学好,就比较难了。 学习web这个前端,我们必须掌握css和html这个层叠样式表和超文本标记语言,这两个是你学习的基础。
今天,我大致罗列一下需要掌握的知识点。HTML
首先我们先要了解一下什么叫HTML?他的运作环境是什么?他的后缀名又是什么?**
**html是超文本标记语言,运作环境是在浏览器里面运行,他的后缀名一般就是.html和.htm。明白html的基本结构(!+tab直接生成)
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
</html>
复制代码
明白什么是单目标签什么是双目标签:可以理解为闭合的标签是双标签,相反就是单标签
<head></head>双标签
<hr/>单标签
复制代码
了解文本标签
font标签
<font></font>
复制代码
文本标签里面的复合属性,在写css的时候我会给大家总结。
在这里我们还有了解标题标签,段落标签,文本标签,以及格式类标签,特殊符号,以及列表标签,字符实体。我一一列举:
标题标签hn(1-6)
<h1></h1>
段落标签 p
<p></p>
文本标签比如b i u del q这样的标签
格式类标签 br和hr
<br />换行
<hr />横线
列表标签ul ol dl
<ul>
<li></li>
</ul>
<ol>
<li></li>
</ol>
无序列表和有序列表都有li
<dl>
<dt></dt>
<dd></dd>
</dl>
自定义列表只有一个dt
字符实体类
用的最多的就是 ;空格
复制代码
我们还要了解href src 和url之间的联系和区别\
href(hyper text reference)指定网络资源的位置,从而在当前元素或者当前文档和由当前属性定义的需要的锚点或资源之间定义一个链接或者关系。Href目的不是为了引用资源,而是为了建立联系,让当前标签能够链接到目标地址。
src (source)指定外部资源的位置,指向的内容将会应用到文档中当前标签所在位置。
url(Uniform Resource Locator)统一资源定位符,俗称网页地址。标准格式是:协议类型:[//服务器地址[:端口号]][/文件路径]文件名?查询
还要知道绝对的url和相对url的区别
URL分为绝对URL和相对URL。当所需资源在远程主机上时,需要使用绝对URL;而当资源在本机上时,可以只提供文件部分,这就是相对URL
这些我们了解完了还要知道图片标签,超链接标签和音频视频标签
<img src=”URL” width=”” height=”” border=”” alt=”” >图片标签
<a href=”” target=”” >百度一下</a>超链接标签
<bgsound src=”” controls >IE浏览器支持的播放器</bgsound>
<audio src=”URL” controls muted autoplay >可能会有浏览器不兼容</audio>
<audio controls autoplay >
<source src=”music.mp3” type=”audio/mp3”>
<source src=”music.ogg” type=”audio/ogg”>
<source src=”music.wmv” type=”audio/wmv” >
</audio>
音频标签
<video src=”” controls muted width=”” height=”’ loop autoplay poster=”” ></video>
<video controls>
<source src=”” type=”video/mp4”>
<source src=”” type=”video/ogg”>
<source src=”” type=”video/wmv”>
</video>
视频标签
复制代码
表格标签也很重要比如火车票,股票等地方都有涉及。\
学习表格标签,我们需要知道table表格tr行td单元格。我们先写一个table,大家看一下。
<table>
<tr>
<td></td>
</tr>
</table>
复制代码
表格标签里面我们需要了解thead,tbody,th。这些标签我介绍一下,thead和tbody是后期维护更好的看到头部信息和主体信息,th就是表头标签,里面的内容居中加粗。
学习完表格我们还要学习表单,我们很多时候会发现登录页面需要表单,表单最多的需多的是账户信息,密码,性别,爱好,地区,用户留言,提交,重置,电话,生日等...里面的信息是通过type不同的值进行改变。最需要注意的是密码这个地方需要隐形字段password这个type值。
<form method="get">
账号:<input type="text" name="zh" value="123"/><br>
密码:<input type="password" name="mm"/><br>
兴趣爱好:<input type="checkbox" id="篮球"/><label for="篮球">篮球</label><input type="checkbox" checked="checked"/>足球<input type="checkbox" />羽毛球<br />
性别:男<input type="radio" name="box" />女<input type="radio" name="box" /><br><!-- name值相同可以多选一 -->
上传文件:<input type="file" /><br>
提交:<input type="submit" />
重置:<input type="reset" /><br>
地区:<select>
<option>北京</option>
<option selected="selected">上海</option>
<option>深圳</option>
</select><br>
留言:<textarea rows="5" cols="20">我是吕恣瑞</textarea><!-- rows是几行,cols是一行多少字 -->
</form>
复制代码
既然学会了表单域我们必须掌握什么是get什么是post,两者区别?\
get和post的区别?
1.get是将传输内容放在浏览器地址栏中,可以模拟发送;post是密文发送,不显示在地址栏中。所以post更安全。
2.地址栏的文本长度受限制,所以get适合传输较短且简单的数据。大数据或文件不能使用get传输,而post的长度和大小不受限制,所以适合传输重要的、较长的和文件。数据大小。
3.get请求是可以缓存的,post请求不可以缓存。
4.get后退页面时,不产生影响,post请求页面后退时,会重新提交请求。
所有的html知识点大家掌握之后就要和css有衔接了,我们需要了解html通用属性
比如id name class title style等。
HTML的部分大致知识点我们就介绍完了,如果对大家有帮助,还望大家点个赞加再看。谢谢!
后期我会更新css样式需要学习的知识点。大家可以点个关注!