今日一问：
下面的样式属性中，属性值设置为百分比数值时，其百分比基数取决于父元素或元素本身的什么属性？
A、(max/min-)height
B、(max/min-)width
C、transform:translate
D、border
答案和解析可在文章底部查看。
今日面试题：
1、说一下HTTP Request报⽂的组成结构？
① 请求行（Request Line）
包含请求的方法、URL和HTTP协议版本信息。
② 请求头部（Request Headers）
以键值对的形式（中间以:分割）包含了若干请求头，常见的请求头有：
- Host：指定服务器域名和端口号。
- User-Agent：标识客户端软件的信息。
- Accept：指定客户端可接受的响应内容类型。
- Content-Type：指定请求体的媒体类型（MIME类型）。
- Content-Length：指定请求体的长度（单位为字节）。
- Cookie：传递客户端要传递的Cookie信息。
- Cache-Control：指定缓存机制。
- 其他。
③ 空行
请求头部和请求体之间有一个空行，用于分隔两者。
④ 请求体（Request Body）
包含了具体的请求参数数据，通常在POST、PUT等请求方法中携带。具体的数据类型取决于请求头中的 Content-Type 。
HTTP Request报⽂示例：
/* Request Line */
POST /login HTTP/1.1
/* Request Headers */
Host: www.****.com
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.34
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp
Accept-Encoding: gzip,deflate,sdch
Accept-Language: zh-CN,zh;q=0.8,en;q=0.6
Content-Type: application/x-www-form-urlencoded
Content-Length: 27
Cookie: authorstyle=yes
/* 空行 */
/* Request Body */
username=user&password=pass
2、说一下HTTP Response报⽂的组成结构？
① 状态行（Status Line）
包含HTTP版本、请求状态码和状态描述信息。
② 响应头部（Response Header）
以键值对的形式（中间以:分割）包含了若干响应头，常见的响应头有：
- Content-type：表示响应内容的MIME类型。
- Content-Length：表示响应内容的长度（单位为字节）。
- Date：表示响应生成的时间。
- Set-Cookie：表示要设置到客户端的Cookie。
- Cache-Control：表示指定缓存机制。
- Expires：指定响应过期的日期和时间。
- Access-Control-Allow-Origin：设置跨域资源共享。
- 其他。
③ 空行
响应头部和响应体之间有一个空行，用于分隔两者。
④ 响应体（Response Body）
包含具体的响应数据，数据的格式和内容由响应头中的 Content-Type 决定。
HTTP Response报文示例：
HTTP/1.1 200 OK
Date: Tue, 08 Jul 2014 05:28:43 GMT
Server: Apache/2
Last-Modified: Wed, 01 Sep 2004 13:24:52 GMT
ETag: "40d7-3e3073913b100"
Accept-Ranges: bytes
Content-Length: 16599
Cache-Control: max-age=21600
Expires: Tue, 08 Jul 2014 11:28:43 GMT
P3P: policyref="http://www.w3.org/2001/05/P3P/p3p.xml"
Content-Type: text/html; charset=iso-8859-1
{"name": "qiu", "age": 25}
3、在HTTP请求和响应中常见的Content-Type类型有哪些？
① application/x-www-form-urlencoded
常用于HTML表单数据POST提交请求，表单数据会被编码为键值对，中间通过=进行连接，多个键值对之间通过&连接。
数据示例：
username=user&password=pass
② multipart/form-data
常用于文件上传，该类型的表单数据可以包含 File 文件。该类型的后面会跟随一个 boundary 属性，请求的具体数据会被 boundary 的属性值分割成多个部分，每个部分都有自己的 Content-Disposition 和 Content-Type属性。
请求头示例：
Content-Type: multipart/form-data; boundary=----WebKitFormBoundary7MA4YWxkTrZu0gW
数据示例：
------WebKitFormBoundary7MA4YWxkTrZu0gW
Content-Disposition: form-data; name="username"
user
------WebKitFormBoundary7MA4YWxkTrZu0gW
Content-Disposition: form-data; name="file"; filename="example.txt"
Content-Type: text/plain
(file content here)
------WebKitFormBoundary7MA4YWxkTrZu0gW--
③ application/json
常用于服务端接口请求和响应，数据类型为JSON格式。
数据示例：
{ "username": "user","password": "pass"}
④ application/octet-stream
常用于文件下载请求，请求数据类型为二进制数据流。
⑤ text/html
常用于响应网页内容，数据类型为HTML文档。
数据示例：
<!DOCTYPE html>
<html>
<body>
<h1>Hello, World!</h1>
</body>
</html>
⑥ text/css
常用于响应网页样式，数据类型为CSS样式表。
数据示例：
body {
background-color: #f0f0f0;
}
⑦ text/javascript
常用于响应网页js脚本信息，数据类型为 js 代码。
数据示例：
document.querySelecter();
⑧ image/png、image/jpeg、image/gif等
常用于图片文件请求，根据具体的图片格式，返回相应的二进制数据。
⑨ video/mp4、audio/mp3等
常用于音视频文件请求，根据具体的文件格式，返回相应的二进制数据。
今日一题答案：AC
解析：
A、(max/min-)height
如果给元素的 height/min-height/max-height 属性设置为百分比数值，则其百分比基数取决于父元素的 height 值。
B、(max/min-)width
如果给元素的 width/min-height/max-height 属性设置为百分比数值，则其百分比基数取决于父元素的 width 值。
C、transform:translate
如果给元素的 translate/translateX/translateY 属性设置为百分比数值，则其百分比基数对应取决于元素本身的 width/height 值。
D、border
如果给元素的 border 属性设置为百分比数值，则无论上下左右边框，其都会无效。因为该属性并不支持设置百分比数值，如果设置了百分比数值，则浏览器会忽略这条样式属性。
该属性只支持两类属性值：① 长度单位，如：px、em、rem等。② 关键字，如：thin、medium、thick等。
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
