前端01 /HTML简单简绍

1.web服务本质

import socket

sk = socket.socket()

sk.bind(("127.0.0.1", 8080))

sk.listen(5)

while True:

    conn, addr = sk.accept()

    data = conn.recv(8096)

    conn.send(b"HTTP/1.1 200 OK\r\n\r\n")

    conn.send(b"<h1>Hello world!</h1>")

    conn.close()

2.浏览器的工作流程

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

3.HTML是什么

1.超文本标记语言（Hypertext Markup Language, HTML）是一种用于创建网页的标记语言。

2.本质上是浏览器可识别的规则，我们按照规则写网页，浏览器根据规则渲染我们的网页。对于不同的浏览器，对同一个标签可能会有不同的解释。（兼容性问题）

3.网页文件的扩展名：.html或.htm

HTML是一种标记语言（markup language），它不是一种编程语言。

HTML使用标签来描述网页。不像python编程语言一样，有逻辑什么的，这个标记语言是没有逻辑的

4.web服务本质

import socket

server = socket.socket()

server.bind(('192.168.16.160',8001))

server.listen()

while 1:

    conn,addr = server.accept()

    from_browers_msg = conn.recv(1024)

    print('from_browers_msg',from_browers_msg.decode('utf-8'))

    send_msg = b'HTTP/

    1.1 200 ok\r\n\r\n'

    # data = b'<h1>daguangtou</h1>'

    conn.send(send_msg)

    # conn.send(data)

    with open('test01.html','r',encoding='utf-8') as f:

        data = f.read()

    import time

    data = data.replace('{{ name }}',str(time.time()))

    conn.send(data.encode('utf-8'))

    conn.close()

5.HTML文档结构

<!DOCTYPE html>

<html lang="zh-CN">   #这个lang表示语言，zh-CN是中文的意思，就是说，你整个文档的内容以中文为主，如果以英文为主，就写成lang='en'

<head>

  <meta charset="UTF-8">

  <title>css样式优先级</title>

</head>

<body> 

</body>

</html>

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>  #网页的标题

</head>

<body>

<h1>24nb</h1>

{{ name }}

</body>

</html>

<!DOCTYPE html>声明为HTML5文档。

<html>、</html>是文档的开始标记和结束的标记。是HTML页面的根元素，在它们之间是文档的头部（head）和主体（body）。

<meta http-equiv="X-UA-Compatible" content=" ie=edge”>  #告诉ie浏览器以最高版本来渲染我

”

<meta name= "viewport” content= "python,go"> #搜索的关键字

<head>、</head>定义了HTML文档的开头部分。它们之间的内容不会在浏览器的文档窗口显示。包含了文档的元（meta）数据，配置信息等，是给浏览器看的，你看到的是在body标签里面写的。

<title>、</title>定义了网页标题，在浏览器标题栏显示。（修改一下title中的内容，然后看一下浏览器，你就会发现title是什么了）

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

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

pycharm中创建一个html文件，你就会发现，整个结构都给你直接生成好了，因为不管什么浏览器，这个文档结构都是这样的。

6.HTML注释

<!--注释内容-->  #找到一行内容ctrl+/就能注释，注释的内容不会在网页上显示出来

6.标签语法

　标签的语法：

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

<标签名 属性1=“属性值1” 属性2=“属性值2”…… />

7.HTML常用标签

标签 意义
定义网页标题
定义内部样式表
定义JS代码或引入外部JS文件
引入外部样式表文件
定义网页原信息

body基本标签

不加标签的纯文字也是可以在body中写的

<b>加粗</b>

<i>斜体</i>

<u>下划线</u>

<s>删除</s>

<p>段落标签</p> #独占一个段落

<h1>标题1</h1>

<h2>标题2</h2>

<h3>标题3</h3>

<h4>标题4</h4>

<h5>标题5</h5>

<h6>标题6</h6>

<!--换行-->

<br>

<!--水平线--><hr> #就是单独个一个水平线

每次加上一些内容，别忘了刷新一下页面，才能看到新添加的效果或者内容，其实上面这些标签很少用

前端01 /HTML简单简绍的更多相关文章

  1. python 简单简绍以及简单的语法

    一.Pthon介绍 Pyhton的创始人为吉多·范罗苏姆(Guido van Rossum).1989年的圣诞节期间,吉多·范罗苏姆在阿姆斯特丹打发时间,决心开发一款新的脚本解释程序,作为ABC语言的 ...

  2. 前端03 /css简绍/css选择器

    前端03 /css简绍/css选择器 目录 前端03 /css简绍/css选择器 昨日内容回顾 html标签 常用标签 table标签:表格标签 input标签 select下拉框 textarea多 ...

  3. SpringCloud（1）生态与简绍

    一:微服务架构简绍学习目标 1.技术架构的演变,怎么一步步到微服务的:2.什么是微服务,优点与缺点  :3.SOA(面向服务)与MicroServices(微服务)的区别 :4.Dubbo 与Spri ...

  4. Python学习（基础简绍）

    今天终于开始了python的学习,至于python的历史我就不说了,百度百科中太详细了,我这里说就是关公面前耍大刀,太自不量力了,所以,废话不多说,直接讲讲我惊天学习Python的收获吧. 1.Pyt ...

  5. Python web前端 01 HTML常用标签

    Python web前端 01 HTML常用标签 一.HTML创建项目 file ---->new project -----> 输入项目名------>创建文件夹 new dicr ...

  6. Eureka 系列（01）最简使用姿态

    目录 Eureka 系列(01)最简使用姿态 0. Spring Cloud 系列目录 - Eureka 篇 1. 服务发现与发现 1.1 服务发现(Service Discovery) 1.2 服务 ...

  7. Feign 系列（01）最简使用姿态

    目录 Feign 系列(01)最简使用姿态 1. 引入 maven 依赖 2. 基本用法 3. Feign 声明式注解 Feign 系列(01)最简使用姿态 Spring Cloud 系列目录(htt ...

  8. NIO 源码分析(01) NIO 最简用法

    目录 一.服务端 二.客户端 NIO 源码分析(01) NIO 最简用法 Netty 系列目录(https://www.cnblogs.com/binarylei/p/10117436.html) J ...

  9. django ORM 简单示例简绍

    简单 models 操作 class Host(models.Model): nid = models.AutoField(primary_key=True) #Nid为主键 hostname = m ...

随机推荐

  1. json 拼装空list、object

    import com.alibaba.fastjson.JSONArray; import com.alibaba.fastjson.JSONObject; public class FastJson ...

  2. Andrew Ng - 深度学习工程师 - Part 1. 神经网络和深度学习（Week 3. 浅层神经网络）

     =================第3周 浅层神经网络=============== ===3..1  神经网络概览=== ===3.2  神经网络表示=== ===3.3  计算神经网络的输出== ...

  3. vue-admin-template搭建后台管理系统的学习（一）

    首先我们来看看这个基础模版的目录结构 ├── build // 构建相关  ├── config // 配置相关├── src // 源代码│   ├── api // 所有请求│   ├── ass ...

  4. 微信小程序-页面栈

    在小程序中以栈的形式维护了当前的所有页面 当发生路由切换的时候,页面栈的表现如下: 初始化:新页面入栈 打开新页面:新页面入栈(调用 API wx.navigateTo 或使用组件 <navig ...

  5. weblogic之高级进阶JMS的应用

    不仅Activemq提供的jms服务,Weblogic也提供了jms服务,很多项目是部署在Weblogic中,使用其提供的jms服务也是很多企业的选择,一直没亲手试过,今天试了下,遇到的小问题还挺多, ...

  6. linux网络编程-socket(1)

    上面是对应的IpV4的地址结构: sin_len整个结构的大小 sin_family协议族,对应Tcp固定为AF_INET,除了tcp协议外还支持unix域协议等 sin_port socket通信的 ...

  7. 动力节点 mysql 郭鑫 34道经典的面试题三

    1.第十五题 15.列出受雇日期早于其直接上级的所有员工编号.姓名.部门名称 思路一:第一步将emp a看成员工表,将emp b 看成领导表,员工表的mgr字段应该等于领导表的主键字段 mysql&g ...

  8. 基于 Blazor 开发五子棋⚫⚪小游戏

    今天是农历五月初五,端午节.在此,祝大家端午安康! 端午节是中华民族古老的传统节日之一.端午也称端五,端阳.此外,端午节还有许多别称,如:午日节.重五节.五月节.浴兰节.女儿节.天中节.地腊.诗人节. ...

  9. python计算矩阵均匀分布程度

    计算N×M(建议维度大于100*100)的0,1矩阵均匀分布程度,值由0到1表示不均匀到均匀 import numpy as np def make_rand_matrix(side=20): # 制 ...

  10. MongoDB副本集replica set（三）--添加删除成员

    在上一篇文章中,我们搭建了3个节点的副本集,集群信息如下: rstest:PRIMARY> rs.config() { "_id" : "rstest", ...