发表于: 2019-09-17 10:57:56

1 1131


今天完成的事:对任务11的js进行了一定的理解;
明天要完成的事
难题:
收获:稍微理解了vertical-align与line-height一下;不过没有花很多时间去分析;而是稍微带一下就过了;
看了师兄关于列表的讲解:
一般来说,首要选择标签是符合语义化,虽然div也能做、但是使用相对应的标签便于代码的理解和维护。 使用列表标签,大多数在需要显示一个系列的内容的时候采取选择
js的学习:接16日的日报:
cookie:
(储存在用户本地终端上的数据):某些网站为了辨别用户身份、进行 session 跟踪而储存在用户本地终端上的数据
我感觉cookie就是个档案;从你出生开始(在服务器上注册开始)创建一个档案(cookie文本);平时在你身上(浏览器里)保留着;哪天你学校有学校的档案去警察局有警察局的档案(不同服务器不是一个cookie(文本)也不在同一个浏览器的文档木里保存;会分开保存))
作用就是识别你是谁你以前干过啥了;记录你现在在干啥;

参数没找到;百度全是用法和问题;没有理论
http  header :在超文本传输协议( Hypertext Transfer Protocol ,HTTP)的请求和响应消息中,协议头部分的那些组件。HTTP消息头用来准确描述正在获取的资源、服务器或者客户端的行为,定义了HTTP事务中的具体操作参数。
(我感觉就是告诉客户端和服务端;你该干嘛怎么干)
客户端请求(Request)或服务器响应(Response)时传递的,位请求或响应的第一行,HTTP消息体(请求或响应的内容)是其后传输。HTTP消息头,以明文的字符串格式传送,是以冒号分隔的键/值对,如:Accept-Charset: utf-8,每一个消息头最后以回车符(CR)和换行符(LF)结尾。HTTP消息头结束后,会用一个空白的字段来标识,这样就会出现两个连续的CR-LF。
HTTP消息头由IANA(The Internet Assigned Numbers Authority,互联网数字分配机构)来整理和维护。其标准最早来源于RFC 4229。IANA将其整理到了消息头文档,文档中还包括了一些新提出的信息头
HTTP消息头支持自定义, 自定义的专用消息头一般会添加'X-'前缀。


,Request(请求),Response(响应):

  • 在HTTP连接中报文分为请求(request)和响应(response)两种

应用层协议(application layer protocol)定义了运行在不同端系统上的应用程序进程如何相互传递报文。()

(简单来说在应用层的传输方式就是先是3次握手(试探一下对方是否是要找的人)确认连接;

然后发报文:先是 http header request(请求)告诉服务器我要干嘛 然后服务器回复你成功(成功了自然就把你要的文件给你了)或是失败或是有问题)


1. 请求报文:HTTP协议使用TCP协议进行传输,在应用层协议发起交互之前,首先是TCP的三次握手。完成了TCP三次握手后,客户端会向服务器发出一个请求报文。

前三行为请求行,其余部分称为request-header。请求行中的method表示这次请求使用的是get方法。请求方法的种类比较多,如option,get,post,head,put,delete,trace等,常用的主要是get,post。Get表示请求页面信息,返回页面实体;post是请求服务器将指定文档作为请求的url中的从属实体,简单说,我们常用的在网页中填写表单然后申请等动作就是使用了post方法,填写用户名密码登录站点就使用了post方法,

(当你确认连接后发出报文,也要根据需求请求相应的数据;比如要整个页面实体就是get;只是一些小地方改动或者form提交数据就是post ;(简单来说就是根据你的需求选择不同的请求方法和路径;说人话就是你跟你爸要钱你能翘个2朗腿要吗?打不死你;只能说我亲爱的老爸;给你爸分私房钱;那就不一样了))

相关链接:相关阅读

  • GET - 从指定的资源请求数据。
  • POST - 向指定的资源提交要被处理的数据

https://www.cnblogs.com/logsharing/p/8448446.html


方法之后是URI,表示请求的页面地址,图中的“/”表示服务器的根目录。之后是表示http的版本。

请求行之后是请求首部。首部常见的部分有如下几个:

l Accept:请求的对象类型。如果是“/”表示任意类型,如果是指定的类型,则会变成“type/”。

l Accept-Language:使用的语言种类。

l Accept-Encording:页面编码种类。

l Accept-Charset:页面字符集。说到这里,需要解释以下字符集和编码的区别。字符集通常对应着一种语言,将语言中的所有字符集合起来就可以视为一种字符集,这样我们可以看出,中文并非是一种字符集,因为中文无法使用一些字符来进行表示;而编码则是将字符转换为计算机所能识别的2进制数的一种方式,例如常说的unicode,UTF-8,ANSI等等,我们在访问一些国外网站会出现乱码的原因就是因为我们浏览器所使用的编码与页面所使用的编码不能互相识别。我们常说的BIG5和GB2312都是编码。

l User-Agent:提供了客户端浏览器的类型和版本。

l Host:连接的目标主机,如果连接的服务器是非标准端口,在这里会出现使用的非标准端口。

l Connection:对于HTTP连接的处理,keep-alive表示保持连接,如果是在响应报文中发送页面完毕就会关闭连接,状态变为close。

(这一部分对照上图基本看一下都懂之前css基础里面有的)

2. 响应报文:当收到get或post等方法发来的请求后,服务器就要对报文进行响应。同样,响应报文也分为两部分。

前两行称为状态行,状态行给出了服务器的http版本,以及一个响应代码。响应代码是服务器根据请求进行查找后得到的结果的一种反馈,共有5大类。分别以1、2、3、4、5开头。

1**表示接收到请求,继续进程,在发送post后可以收到该应答。


2**表示请求的操作成功,在发送get后返回。


3**表示重发,为了完成操作必须进一步动作。


4**表示客户端出现错误。


5**表示服务器出现错误。


其余部分称为应答实体。



其中的server表示服务器软件版本,date标注了当前服务器的时间,connection标明连接关闭,

抓包可以发现在响应返回后服务器向客户端发出fin包单向关闭了连接。Expires表示在某个时间以前可以不用重新缓存该页面,而cache-control表示对页面是否进行缓存。Pragma的参数no-cache表示对页面不进行缓存。而content-type表示了应答请求后返回的内容类型。Content还有内容长度和内容语言以及内容编码三个项,其中内容长度只有在请求报文中的connection值为keep-alive时才会用到。

cookie 的补充:

3. Cookie:cookie是一种类似缓存的机制,它保存在一个本地的文本文件中,其主要作用是在发送请求时将cookie放在请求首部中发送给服务器,服务器收到cookie后查找自己已有的cookie信息,确定客户端的身份,然后返回相应的页面,cookie的方便之处在于可以保持一种已登录的状态,例如:我们注册一个论坛,每次访问都需要进行填写用户名和密码然后登录。而使用了cookie后,如果cookie没有到达过期时间,那么我们只需在第一次登录时填写信息然后登录,以后的访问就可以省略这一步骤。

在HTTP协议中,cookie的交互过程是这样的:首先是三次握手建立TCP连接,然后客户端发出一个http request,这个request中不包含任何cookie信息。

当服务器收到这个报文后,针对request method作出响应动作,在响应报文的实体部分,加入了set-cookie段,set-cookie段中给出了cookie的id,过期时间以及参数path,path是表示在哪个虚拟目录路径下的页面可以读取使用该cookie,将这些信息发回给客户端后,客户端在以后的http request中就会将自己的cookie段用这些信息填充。

如果用户在连接中通过了服务器相应的认证程序,服务器会添加一个cdb_auth到set-cookie中,这个段表示了客户端的认证信息,而客户端以后在访问过程中也会将cdb_auth信息写入自己的cookie字段。服务器每次收到http request后读取cookie,然后根据cookie的信息返回不同的页面。例如,没有通过认证的客户端在request中不会有cdb_auth,因此服务器读取cookie后,不会将通过认证的客户端的页面返回给该客户端。




错误代码:常见错误代码;

https://blog.csdn.net/chudongfang2015/article/details/78639677

(这个东西应该就是上面Response(响应报文)里的响应代码

任务11 除了参数都有标记了;



css回顾:

z-index和叠加上下文是如何形成:

先了解一下z-index的基本信息:

在W3C是这样描述的:每个元素都具有三维空间位置,除了水平和垂直位置外,还能在 "Z轴" 上层层相叠、排列。元素在 "Z轴" 方向上的呈现顺序,由层叠上下文和层叠级别决定。在文档中,每个元素仅属于一个层叠上下文。元素的层叠级别为整型,它描述了在相同层叠上下文中元素在 "Z轴" 上的呈现顺序。同一层叠上下文中,层叠级别大的显示在上,层叠级别小的显示在下,相同层叠级别时,遵循后来居上的原则,即其在HTML文档中的顺序。不同层叠上下文中,元素呈现顺序以父级层叠上下文的层叠级别来决定呈现的先后顺序,与自身的层叠级别无关。


需要注意的是 z-index 虽然很给力,却只能应用于定位元素(即设置了 position 属性为非 static 值),其它情况下,z-index 将被忽略。

什么是层叠上下文(STACKING CONTENT)

在一个层叠上下文,所有的元素根据规则从下到上排列,分成了七个等级:

1、背景和边框 — 形成层叠上下文的元素的背景和边框。 层叠上下文中的最低等级。

2、负z-index值 — 层叠上下文内有着负z-index值的子元素。

3、块级盒 — 文档流中非行内非定位子元素。

4、浮动盒 — 非定位浮动元素。

5、行内盒 — 文档流中行内级别非定位子元素。

6、z-index: 0 — 定位元素。这些元素形成了新的层叠上下文。

7、正z-index值 — 定位元素。层叠上下文中的最高等级


1,如果两个元素都没有定位发生位置重合现象或者两个都已定位元素且z-index相同发生位置重合现象,那么按文档流顺序,后面的覆盖前面的。

2,如果两个元素都没有设置z-index,使用默认值,一个定位一个没有定位,那么定位元素覆盖未定位元素

3,如果父元素z-index有效,那么子元素无论是否设置z-index都和父元素一致,在父元素上方

4,如果父元素z-index失效(未定位或者使用默认值),那么定位子元素的z-index设置生效

5,如果兄弟元素的z-index生效,那么其子元素覆盖关系有父元素决定

(关于z-index我理解的不多算是接触到了一些新的知识不过这方面用的少)

什么是CSS SPRITES?

https://www.jianshu.com/p/d25aa9e551c2



rgba和opasity的区别:

rgba 是颜色加了一个通道Alpha。

Alpha参数为透明值,在0~1之间。RGBa 扩展了 RGB的颜色

rgba()是css中设置背景颜色中的一个属性。


1.Opasity是什么:

Opasity属性设置一个元素的透明度级别。

Opasity是css的一个属性

value指不透明度。从0.0(完全透明)到1.0(完全不透明);


value 取值0~1,0为完全透明,1为完全不透明。默认是继承父元素opacity属性,所以子元素会继承父元素的opacity属性值,从而产生相同的效果。


3.他们俩的区别是什么:

rgba(   )的作用对象是元素的背景颜色或元素的颜色,其对象的子元素不能够继承它的透明度;

opacity的作用对象是元素,以及元素的所有内容,并且其子元素能够继承它的透明度。


重新温习了display和visiblity的区别和作用;


看了一下margin和padding的一些东西感觉没学到什么;还是回去码任务14把;

拿到任务14的时候感觉好懵逼啊???

组件我知道;组件库是个啥???

组件库就是:一个组件一个文件夹,把所有文件夹综合起来就是一个库;

但是组件到底要怎么写呢?直接拿css不对啊?我看都是带html的啊??

再看看我好像理解错了css的组件库和js的组件库是不一样的

感觉看了一天的理论还是没搞懂啥叫组件库,看的理论挺多的但是没串起来太零散了;

还是先把任务14页面写了吧;明天问问师兄;




返回列表 返回列表
评论

    分享到