web前端学习笔记之html(一)

前段时间在自己比较空闲的时候 有幸接触到了一些资源网站
抽了点时间了解了一下web前端
在此记录一下自己的学习过程和自己的学习心得

从http协议开始说起

说起http,相信每一位小伙伴都会比较熟悉这个名词。那你有没有想过,它到底是什么呢?

上网就是向服务器请求数据,向哪个服务器呢发出请求呢?在我们上网时,我们经常会在浏览器的搜索框上输入你要搜索的网址, 这个网址可以通俗的理解为我们你要访问服务器的地址。

服务器是怎么知道你要请求什么数据的呢?又或者说你们之间是通过什么来协商你请求网页数据的呢?这就用到了协议的概念。我们知道当你打开一个网页上,上面有着各种文字图片以及超链接等,我们把这些数据叫做超文本,用来在计算机和服务器之间进行传输文本的协议就是http协议

计算机是用二进制进行传输数据的,对于图片,文字,超链接这些复杂的东西,计算机是如何表示的呢?由此就引出了==超文本标记语言HTML==

PL5heH.jpg

HTML简述

HTML是英语Hyper Text Markup Language的缩写,超文本标记语言

.html 就是网页的格式

html中,负责描述页面的语义,除了语义什么都没有

html骨架和基本语法

HTML是有标签对儿构成的,标签对儿由起始标签<h>和结束标签组成</h>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
        <title>显然这是一个标题</title>
    </head>
    <body>
        <p>我是一个段落标签呀</p>
    </body>
</html>

第一行:网页的生命头,术语叫做DTD。常规不解释
第二行,html最大标签。xmlns命名空间。
第四行:<head>标签,用来配置。
第五行:字符集配置
<title>网页的标题 <body>标签内就是网页的内容。

推荐编程软件和快速生成骨架

编程软件的选择

在了解了html的基本骨架和语法结构之后,这里推荐一个个人觉得用起来比较舒服的写代码的软件sublime官网链接

在下载完成后,我们需要安装一些前端必备的插件,当然这些插件有利也有弊,对于新手来说这个会让你变得越来越懒,建议在熟悉标签之后达到一定的水准再使用这些便捷的插件。
具体的安装插件的方法可以参考sublime Text3的常用插件的安装及使用
快速生成骨架
在安装好插件之后,打开sublime。新建html文档,保存。
输入html:xt,然后tab一下,马上补全。
PL5RyD.png
PL52QO.png
更多功能,尽请下载体验

本篇文章作为前端入门基础 简单的介绍了一下前端的一些基础概念和sublime软件的安装与使用。后续内容将着重于html的各种标签。
以上
PL5WOe.jpg

当前网速较慢或者你使用的浏览器不支持博客特定功能,请尝试刷新或换用Chrome、Firefox等现代浏览器