ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

2020.1.29 //HTML基础学习

2020-01-29 20:40:51  阅读:328  来源: 互联网

标签:网页 请求 标签 2020.1 29 HTML 浏览器 属性


HTML基础学习

一、互联网原理
HTML:制作网页。
互联网原理:上网即请求数据。
网页是由一堆文件构成,上网时通过HTTP协议,在本地计算机和服务器之间有真实的、物理的文件传输协议。
如:
在浏览器输入一个网址,浏览器会通过HTTP协议向服务器发送请求,服务器响应后,将文件传输到浏览器端,过程中有实际的物理文件的传输。

相关概念:
1.服务器(server)
服务器本身也是一台计算机,功能比我们普通的计算机要强大。用于存放网页文件和数据。
数据上传和更改是在本地计算机上完成,通过一些管理软件远程操作服务器。
服务器必须24小时开机,保证随时可以访问。

2.浏览器(browser)
网页接受和请求的客户端。
浏览器:是客户端渲染网页使用的软件。
浏览器作用:发起HTTP请求,接收服务器传输的文件。
浏览器由不同的厂商提供和维护,有很多浏览器品牌、版本。
全球五大浏览器:谷歌(chrome)、火狐(Firefox)、IE、苹果(Safari)、欧朋(opera)
请求的数据并不是存在浏览器软件上,而是存在一个临时文件夹。
临时文件夹寻找:
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
作用:临时存储网页文件。任何网站第二次打开都会更快,原因是第一次打开时,已经将大部分文件缓存在本地计算机里。

3.HTTP协议(hypertext transfer protocol即超文本传输协议)
HTTP包含请求和相应两部分。
发起请求的方法:在浏览器中输入网址,或者点击网址链接。
请求:request,浏览器根据网址向对应的服务器发送请求。
响应:response,服务器根据请求响应文件,将网页传输给客户端,在浏览器中进行网页的渲染。
浏览一个浏览器时,HTTP请求并不是一个,而是多个HTTP请求同时发送。请求的包含网页的图片、视频、音频等文件。
在浏览器中怎么看请求过程呢?
鼠标右键—检查—Network

二、HTML基础
相关概念:
1.纯文本
常见的.txt文件为纯文本文件。
这里,可以用记事本和word相比较。
.doc:在传输过程中,同时传递内容和样式,文件大小包括内容和样式。
.txt:在传输过程中,只传递内容,不传递样式,文件大小只包含文字。
纯文本文件特点:1.只有文件,没有样式。2.用记事本等纯文本编辑器可以读写。
html/css/js都是纯文本文件。
txt文件样式设置之后只是一个本机显示状态,不会保存在文件里,其他计算机查看时,默认显示状态。

2.HTML基本概念
HTML:hypertext markup language超文本标记语言。
作用:负责描述文档的语义的一门语言。(制作网页页面)
HTML用文本去给普通文本添加语义,用到的这些文本就是超文本。
如:

<h1><h1>添加了一个一级标题的语义
<h2><h2>添加了一个二级标题的语义
<p></p>添加一个段落的语义

HTML是用来添加语义的,而不是来添加样式的。真正的样式是由css来控制。

3.sublime
专门制作网页的软件。sublime是高效率程序书写工具。
快捷键:
html:xt->点击tab键/ctrl+E------>自动生成HTML文档结构
新标签->tab------>自动生成标签对
H$数字------>生成h1到h数字的标签
标签名
数字------>生成数字多个的同一个标签
ctrl+滚轮------>放大缩小文字
按住滚轮拖动------>选中多行,一起进行编辑
shift+ctrl+D------>复制光标所在行
shift+ctrl+K/ctrl+X------>删除光标所在行
shift+ctrl+↑------>上移当前行
shift+ctrl+↓------>下移当前行

三、HTML
1.HTML骨架:
HTML基本骨架
html:最根本的标签,表示整个的网页。
head:网页的头部,里面都是一些网页的配置,除了title标签,其他内容在网页上是不可见的。
title:网页的标题。
body:用户能够看到的内容区域。

2.DTD
DTD:文档定义类型也叫文件声明类型,即HTML文件的第一行内容。定义HTML文件使用的是哪一个HTML规范。
作用:告知浏览器该网页使用的是哪种HTML的规范。
HTML规范:书写HTML要遵循的规范,规定了我们使用的标签,语法。
HTML、css、js
规范的维护和制定的组织w3s。
中文网站:
HTML1.0-HTML5
HTML4.0版本,将结构和样式进行了分离,常用的HTML4.01版本。
XHTML1.0在4.01版本基础进行严格化和扩展升级,严格规定标签必须小写,属性必须用双引号包裹,结束标签的关闭符号/必须写。
两个规范下面分别包含3个小规范:
strict 严格版:不能使用font等废弃标签,不能使用框架级,结构和样式分离。
transitional 过渡版:可以使用font等废弃标签,不能使用框架集。
frameset 框架集版:可以使用框架集。

3.HTML标签
命名空间
HTML标签是一个双标签。
双标签:有开始标签和结束标签。必须是成对出现的。
HTML标签有两个属性。
xmlns,是xml的namespace规定了我们的标签使用的是哪种命名规范。用户浏览器不一致,必须规范死什么是标签什么是内容,标签具有什么语义。
lang:规定我们html文件标签必须使用英文。

4.head标签
head标签是一对双标签,里面是为我们对网页进行一个配置。
meta标签规范的是我们网页使用的字符集。
我们常使用的字符集。
国际标准字库:utf-8,包括世界上所有的人类语言。一个汉字3个字节。
国家标准字库:gb2312/gbk,包括所有的简笔字,大部分繁体,一些特殊符号,片假名。中文占2个字节。
使用情况:
1.如果制作外文网站,使用utf-8.
2.如果有大量中文,用gbk。
注:规定的字符集必须与编辑软件的保存字符集类型保持一致,否则会出现乱码。

title标签:是一个双标签,内部书写的是网页的标题。
搜索引擎优化:SEO,。提升搜索排名。
title里的文字会作为关键首先被搜索引擎抓取。

四、HTML的语法
1.HTML对换行和空格不敏感。
在编辑html时,标签之间对换行空格不敏感,对标签之间的嵌套敏感。
为保证代码的可读性强,需要对我们的标签进行合理的缩进。

2.空白折叠现象
在普通文本内部:如果有空格、缩进、换行,将这些空白区域折叠成一个空格。
要想显示多个空格,使用特殊字符&nbsp;

3.HTML标签
①标签必须写在一对尖括号里


②双标签必须成对出现,如果书写不完整,会影响后面的标签。
③标签对中的结束标签必须写关闭符号/。
④标签分类:
容器级:内部还可以放置嵌套任意类型的标签,甚至容器级标签。
文本级:只能放文字、图片、表单元素、废弃文字修饰标签等。不能放置容器级标签。

4.标签属性
每个标签都有自己的属性。
属性都有属性值,属性名k(key),属性值v(value),键值对写法。
①属性书写在标签的其实标签内部,与标签名之间用空格隔开,属性与属性之间也需要用空格隔开。
②键值对书写格式:k=“v”。中间不能有空格。

p

③属性值必须使用双引号包裹,XHTML严格要求使用双引号。 ④标签属性值可以有一个或多个,多个属性值之间用空格隔开,全部必须在属性内部。

p

五、HTML标签
1.h系列(headline)
h系列标签分为了六个等级,表示一到六标题。
语义:给文本添加一个一到六级的标题语义。
一般一个页面里面h1标签的权重是最高的,最便于引擎搜索的。一个页面只写一个h1标签,一般将这个标签给logo。
所有的h系列标签虽然是容器级,他们之间并没有嵌套关系。

2.p标签(paragraph)
给文本添加一个段落的语义。
注:一个p标签只能作用于一个段落。

3.img标签(image)
表示引入一张图片,本身相当于一个特殊文本。
可插入类型:jpg、png、gif。
img标签是一个单标签。

img标签属性:
src:source,资源表示图片的路径。
width:图片的宽度。单位是px。
height:图片的高度。
border:边框属性;它的值可以设置边框的厚度。
title:设置提示文本。
alt:设置图像没有找到时候的替换文本。

猫猫敲给力 发布了150 篇原创文章 · 获赞 4 · 访问量 6243 私信 关注

标签:网页,请求,标签,2020.1,29,HTML,浏览器,属性
来源: https://blog.csdn.net/qq_45666654/article/details/104109746

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有