前端之head

HTML介绍

 1 impor socket
 2 
 3 sk = socket.socket()
 4 
 5 sk.bind(("127.0.0.1",8888))
 6 sk.listen(5)
 7 
 8 while True:
 9     conn,addr = sk.accept()
10     data = conn.recv(1024)
11     conn.send(b"HTTP/1.1 200 OK\r\n\r\n")
12     conn.send(b"<h1>Devil May Cry</h1>")
13     conn.close()
Web服务本质

浏览器发送请求 -> HTTP协议 -> 服务端接收请求 -> 服务端返回响应 -> 服务端把HTML文件内容发给浏览器 -> 浏览器渲染页面

 

HTML是什么？

  • 超文本标记语言（Hypertext Markup Language, HTML）是一种用于创建网页的标记语言。
  • 本质上是浏览器可识别的规则，我们按照规则写网页，浏览器根据规则渲染我们的网页。对于不同的浏览器，对同一个标签可能会有不同的解释。（兼容性问题）
  • 网页文件的扩展名：.html或.htm

 

HTML不是什么？

　　HTML是一种标记语言(markup language)，他不是一种编程语言

　　HTML使用标签来描述网页。

HTML文档结构

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>css样式优先级</title>
</head>
<body>

</body>
</html>
HTML文档结构

　　1.<!DOCTYPE html>声明为HTML5文档

　　2.<html>、</html>是文档的开始标记和结束的标记，是HTML页面的根元素，在他们之间是文档的头部(head)和主体(body)

　　3.<head>、</head>定义了HTML文档的开头部分，它们之间的内容不会在浏览器的文档窗口显示，包含了文档的元(meta)数据

　　4.<title>、</title>定义了网页标题，在浏览器标题栏显示

　　5.<body>、</body>之间的文本是可见的网页主体内容

 

注意：对于中文网页需要使用<meta charset = "utf-8">声明编码，否则会出现乱码。有些浏览器会设置GBK为默认编码，所以你需要设置为<meta charset = "gbk">

 

HTML标签格式

  • HTML标签是由尖括号包围的关键字，如<html>, <div>等
  • HTML标签通常是成对出现的，比如：<div>和</div>，第一个标签是开始，第二个标签是结束。结束标签会有斜线。
  • 也有一部分标签是单独呈现的，比如：<br/>、<hr/>、<img src="1.jpg" />等。
  • 标签里面可以有若干属性，也可以不带属性。

标签的语法

  • <标签名 属性1=“属性值1” 属性2=“属性值2”……>内容部分</标签名>
  • <标签名 属性1=“属性值1” 属性2=“属性值2”…… />

几个很重要的属性:

  • id：定义标签的唯一ID，HTML文档树中唯一
  • class：为html元素定义一个或多个类名（classname）(CSS样式类名)
  • style：规定元素的行内样式（CSS样式）

HTML注释

<!--注释内容-->
注释内容

 

<!DOCTYPE>标签

　　<!DOCTYPE> 声明必须是 HTML 文档的第一行，位于 <html> 标签之前。

　　<!DOCTYPE> 声明不是 HTML 标签；它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。

 

HTML常用标签

　　head内常用标签

标签意义
<title></title> 定义网页标题
<style></style> 定义内部样式表
<script></script> 定义JS代码或引入外部JS文件
<link/> 引入外部样式表文件或网站图标
<meta/> 定义网页原信息

 

Meta标签介绍：

  • <meta>元素可提供有关页面的元信息（mata-information）,针对搜索引擎和更新频度的描述和关键词。
  • <meta>标签位于文档的头部，不包含任何内容。
  • <meta>提供的信息是用户不可见的。

　　meta标签的组成：meta标签共有两个属性，他们分别是http-equiv属性和name属性,不同的属性又有什么不同的参数值，这些不同的参数值就

　　实现了不同的网页功能

 

1.http-equiv属性:相当于http的文件头作用，它可以向浏览器传回一些有用的信息，以帮助正确的显示网页内容，与之对应的属性值为content,

content中的内容其实就是各个参数的变量值

<!--指定文档的编码类型(需要知道)-->
<meta http-equiv="content-Type" charset=UTF8">  
<!--2秒后跳转到对应的网址，注意引号(了解)-->
<meta http-equiv="refresh" content="2;URL=https://www.oldboyedu.com">
<!--告诉IE以最高级模式渲染文档(了解)-->
<meta http-equiv="x-ua-compatible" content="IE=edge">
http-equiv属性

 

2.name属性:主要用于描述网页，与之对应的属性值为content，content中的内容主要是便于搜索引擎机器，人查找信息的分类信息用的

<meta name="keywords" content="meta总结,html meta,meta属性,meta跳转">
<meta name="description" content="老男孩教育Python学院">
name属性

 

posted @ 2019-03-29 19:15  -Rye-  阅读(231)  评论(0)    收藏  举报