前端HTML基础和head部分
一、SOCKET服务器与浏览器交互
CS模式 --> BS模式
CS模式逐渐向BS模式转移，底层都是socket客户端
浏览器给服务器发送请求 --> 服务器收到请求 --> 服务器给浏览器回复响应
由于浏览器版本众多，而且网络的类型众多，socket服务器和浏览器之间收发信息，必须格式要统一，遵循HTTP协议
socket服务器与浏览器交互
'''
socket与浏览器交互
'''
import socket sk = socket.socket()
sk.bind(('127.0.0.1',8080))
sk.listen() while 1:
conn,add = sk.accept()
data = conn.recv(9000)
print(data)
# HTTP协议的格式给浏览器回复消息
conn.send(b'HTTP/1.1 200 OK\r\ncontent-type:text/html;charset=utf-8\r\n\r\n')
with open('s1.txt','rb') as f:
msg = f.read()
conn.send(msg)
conn.close()
二、web的原理
① 浏览器地址输入URL
② 浏览器往服务器发消息
③ 服务器接收消息
④ 服务器回复消息（从文件中读取数据）
⑤ 浏览器收到消息（按照一个约定好的规则展示出来）
三、HTML
超文本标记语言，本质上是浏览器可识别的规则，不同的浏览器都是同一个规则
HTML是一种标记语言，不是编程语言
浏览器的极速模式：使用chrome内核
浏览器的兼容模式：使用IE内核
四、HTML文档结构
<!DOCTYPE html>
<html lang="zh-CN">
<head>
</head>
<body>
</body>
</html>
<html>、</ht
ml>是文档的开始标记和结束的标记。是HTML页面的根元素，在它们之间是文档的头部（head）和主体（body）。<head>、</head>定义了HTML文档的开头部分。它们之间的内容不会在浏览器的文档窗口显示。包含了文档的元（meta）数据。
<body>、</body>之间的文本是可见的网页主体内容。
<!DOCTYPE> 标签
<!DOCTYPE> 声明必须是 HTML 文档的第一行，位于 <html> 标签之前。
<!DOCTYPE> 声明不是 HTML 标签；它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。
html中把连续的空格和换行都解析成一个空格，没有缩进的概念，所有的操作都根据标签
id：定义标签的唯一ID，HTML文档树中唯一
class：为html元素定义一个或多个类名（classname）(CSS样式类名)
style：规定元素的行内样式（CSS样式）
HTML标签是由尖括号包围的关键字，如<html>, <div>等
HTML标签通常是成对出现的，比如：<div>和</div>，第一个标签是开始，第二个标签是结束。结束标签会有斜线。
也有一部分标签是单独呈现的，比如：<br/>、<hr/>、<img src="1.jpg" />等。
标签里面可以有若干属性，也可以不带属性。
六、注释
<!--注释-->
七、head内部标签
head标签内的内容是用于浏览器识别的
<head>
<title>网页标题</title>
<style>定义内部样式表</style>
<script>定义JS代码或者引入外部JS文件</script>
<link rel="stylesheet" href="">引入外部样式表文件
</head>
title 定义网页标题
style 定义内部样式表
script 定义JS代码或引入外部JS文件
link 引入外部样式表文件
meta标签
meta标签的组成：meta标签共有两个属性，它们分别是http-equiv属性和name 属性，不同的属性又有不同的参数值，这些不同的参数值就实现了不同的网页功能。
1.http-equiv属性：相当于http的文件头作用，它可以向浏览器传回一些有用的信息，以帮助正确地显示网页内容，与之对应的属性值为content，content中的内容其实就是各个参数的变量值。
<!--3表后跳转到www.google.com.hk，refresh是刷新-->
<meta http-equiv="refresh" content="3;URL=https://www.google.com.hk">
<!--指定文档的编码类型-->
<meta http-equiv="content-type" charset="UTF-8">
<!--IE以最高级模式渲染文档-->
<meta http-equiv="x-ua-compatible" content="IE=edge">
2.name属性: 主要用于描述网页，与之对应的属性值为content，content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。
keywords 关键字，用于搜索引擎搜索，爬虫，SEO
description 描述信息，搜索引擎展示网页的时候展示出来
<meta name="description" content="全球领先的综合性网上购物中心。超过100万种商品在线热销"/>
<meta name="keywords" content="网上购物，网上商城，网上买书，购物中心，在线购物"/>
前端HTML基础和head部分的更多相关文章
- Web前端开发基础 第一天（Html和CSS）
学习web前端开发基础技术需要掌握:HTML.CSS.JavaScript语言.下面我们就来了解下这三门技术都是用来实现什么的: 1. HTML是网页内容的载体.内容就是网页制作者放在页面上想要让用户 ...
- 网络统计学与web前端开发基础技术
网络统计学与web前端开发基础技术 学习web前端开发基础技术(网页设计)需要了解:HTML.CSS.JavaScript三种语言.下面我们就来了解一下这三门技术在网页设计中的用途: HTML是网页内 ...
- 前端总结·基础篇·CSS（一）布局
目录 这是<前端总结·基础篇·CSS>系列的第一篇,主要总结一下布局的基础知识. 一.显示(display) 1.1 盒模型(box-model) 1.2 行内元素(inline) &am ...
- 前端总结·基础篇·CSS（二）视觉
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 前端总结·基础篇·CSS(四)兼容 目录 一.动画(animation)(IE ...
- 前端总结·基础篇·CSS（三）补充
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 目录 一.移动端 1.1 视口(viewport) 1.2 媒体查询(medi ...
- 前端总结·基础篇·JS（一）五大数据类型之字符串（String）
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(二)补充 前端总结·基础篇·JS(一)五大数据类型之字符串(String) 目录 这是& ...
- 前端总结·基础篇·JS（二）数组深拷贝、去重以及字符串反序和数组（Array）
目录 这是<前端总结·基础篇·JS>系列的第二篇,主要总结一下JS数组的使用.技巧以及常用方法. 一.数组使用 1.1 定义数组 1.2 使用数组 1.3 类型检测 二.常用技巧 2.1 ...
- 前端总结·基础篇·JS（三）arguments、callee、call、apply、bind及函数封装和构造函数
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 前端总结·基础篇·JS(一)原型.原型链.构造函数和字符串(String) 前 ...
- 前端总结·基础篇·JS（四）异步请求及跨域方案
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 前端总结·基础篇·JS(一)原型.原型链.构造函数和字符串(String) 前 ...
- Web前端-Ajax基础技术(下)
Web前端-Ajax基础技术(下) 你要明白ajax是什么,怎么使用? ajax,web程序是将信息放入公共的服务器,让所有网络用户可以通过浏览器进行访问. 浏览器发送请求,获取服务器的数据: 地址栏 ...
随机推荐
- 深入浅出深度学习：原理剖析与python实践_黄安埠(著) pdf
深入浅出深度学习:原理剖析与python实践 目录: 第1 部分 概要 1 1 绪论 2 1.1 人工智能.机器学习与深度学习的关系 3 1.1.1 人工智能——机器推理 4 1.1.2 机器学习—— ...
- intellij 插件的使用
目录 intellij 插件的使用 插件的设置 插件推荐 @(目录) intellij 插件的使用 插件的设置 在 IntelliJ IDEA 的安装讲解中我们其实已经知道,IntelliJ IDEA ...
- 利用cglib给javabean动态添加属性，不用在建VO
有的时候 比如你用的是hibernate或者Spring jdbc 来做dao层进行数据库相关的操作的时候,若果是单表的操作的时候 还比较简单 hibernate可直接返回(get,load)你的需要 ...
- pipline中执行shell脚本推送镜像并且部署
实验架构: 192.168.0.96 gitlab 192.168.0.97 jenkins 192.168.0.98 harbor.docker集群 说明:下面代码编译镜像那一步的代码必须靠左,目的 ...
- 【TensorRT】自定义网络层的实现custom layers
参考 1. Extending TensorRT With Custom Layers; 2. TensorRT Samples: MNIST(Plugin, add a custom layer); ...
- Flask 数据库连接
Flask拥有丰富的扩展组件,数据库管理方面Flask-SQLAlchemy简化了数据库管理的操作.SQLAlchemy是一个很强大的关系型数据库框架,支持多种数据库后台.其不但提供了高层ORM,而且 ...
- Hive 企业调优
9.企业级调优 9.1 Fetch 抓取 Fetch 抓取:Hive 中对某些情况的查询可以不必使用 MapReduce 计算: hive.fetch.task.conversion:more 9.2 ...
- dotnet core JWT Demo
JWT介绍 JSON Web Token(JWT)是目前最流行的跨域身份验证解决方案.JWT的官网地址:https://jwt.io/. 通俗地来讲,JWT是能代表用户身份的令牌,可以使用JWT令牌在 ...
- win10改装win7
参考链接: https://jingyan.baidu.com/article/3ea51489d0f3c852e61bba01.html 1. 制作win7 U盘启动盘 2. 设置BIOS 1:OS ...
- thinkphp5.0数据导出excel表格
第一步.创建Model类文件(名称自定) 第二步.在类中写入以下代码 <?php namespace Admin\admin\model; use think\Model; class Mark ...