简单的前端语言

目录

一.介绍

1.什么是前端

2.什么是后端

3.为什么要学习前端

4.前端学习哪些内容

二.HTTP协议

1.HTTP协议的四大特性:

2.响应状态码

三.HTML介绍

1.什么是html标签

2.html文档介绍

3.如何打开html文档

4.head标签中常用的标签

5.body中常用的标签


一.介绍

1.什么是前端

前端是所有跟用户直接打交道的都可以称之为是前端语言

例如:网页

2.什么是后端

就是一堆代码,用户不能够直接看到,不直接与用户打交道的称之为是后端语言

常见的后端:python,java等

3.为什么要学习前端

学了前端以后我们就可以做全栈工程师(会后端,会前端,会DB,会运维等)

我们只需要学习写一些简单的页面、会调试别人写的页面和看懂别人写的页面代码即可

4.前端学习哪些内容

  1. HTNL:网页骨架,只是负责显示一些内容,但是显示出来的内容不好看,没样式
  2. CSS:对页面骨架的美化,让页面变得好看
  3. JavaScript:html、css都是静态的,JS能够让网页动起来,变得更加美观
  4. bootstrap、jQuery

称之为三剑客

二.HTTP协议

1.HTTP协议的四大特性:

  1. 基于请求和响应的(有请求,有响应)
  2. 它是基于TCP协议之上的应用层协议
  3. 无状态:就是这个协议他不能够在浏览器里保存数据,现在使用的像是淘宝、京东之类的网站都需要登录,这些数据是靠cookie、session、token、jwt等保存的
  4. 短链接

请求数据

请求首行(请求方式、协议和版本号)

请求头(一大堆的K:V键值对)

换行符(\r\n)

响应数据

响应首行(响应状态码)

响应头(一大堆K:V键值对)

换行符(\r\n)

请求方式

有很多种,现在只学两种

python 复制代码
get
    	"""当朝服务端索要数据的时候,一般使用get请求方式"""
        https://huodong.taobao.com/wow/a/act/tao/dailyact/4634/wupr?spm=a21bo.jianhua.201867-main.1.5af92a89NWpkvM&wh_pid=dailyAct-257518
        
        https://huodong.taobao.com/index/v1/?k=v&k1=v1&k2=v2
        https://huodong.taobao.com/func
        def index()
        	# 需要参数?
        def func()
        
        
    post
    	"""当朝服务端提交数据的时候,一般采用post请求"""
        post请求,参数在哪里传递?
   面试题:get和post的区别?
		1. get:
        	索要数据的时候使用
            传参方式:在网址栏的问号后面:key=value的键值对方式
            数据传递不安全
            数据传递的时候,携带的数据量是有限制的,大概4KB左右的数据
         2.post:
        	提交数据的时候使用
            在请求体里面
            数据传递更加安全
            数据传递没有限制,想传多少传多少

2.响应状态码

使用一个特殊的数字代表一串复杂的描述性信息

1XX:代表的是请求数据成功,但是这个时候还可以继续往服务端提交数据

2XX:200 OK 代表的是请求成功

3XX:301 302 代表的是重定向

4XX:404 Not Found 代表的是资源找不到

5XX:500 502 和404差不多,代表的是服务器内部错误

三.HTML介绍

1.什么是html标签

你在网页中所能够看到的东西都是HTML标签

html 复制代码
<h1>hello python</h1>
<h5>hello python</h5>
<a href='http://baidu.com'>click me</a>
<img src=''>

2.html文档介绍

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  
</head>
<body>

</body>
</html>

<head> 标签里面写的内容一般不是让用户看的,给程序员看的
<body> 标签才是用户看的,在body里面写什么,浏览器就显示什么,head里面写的代码是对body中的代码做控制

3.如何打开html文档

  1. 直接点击pycahrm右上角的浏览器图标

  2. 直接找到文档所在的位置,右键选择使用浏览器打开即可

"""浏览器就是前端的解释器,所有的前端代码都是有浏览器来翻译的"""

4.head标签中常用的标签

html 复制代码
  <title>Title</title> 就是浏览器标签页上显示的内容
        <title>Title</title>
<!--    <style>-->
<!--        /*写css样式的*/-->
<!--        a {-->
<!--            color:  red;-->
<!--        }-->
<!--    </style>-->
    <link rel="stylesheet" href="my.css">
<!--    <script>-->
<!--        alert(123)-->
<!--    </script>-->
    <script src="my.js"></script>

5.body中常用的标签

html 复制代码
# 基本标签:
    <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>
# 特殊字符
	内容	对应代码
    空格	&nbsp;
    >	&gt;
    <	&lt;
    &	&amp;
    ¥	&yen;
    版权	&copy;
    注册	&reg;
相关推荐
右子4 小时前
理解响应式设计—理念、实践与常见误解
前端·后端·响应式设计
KaiSonng4 小时前
【前端利器】这款轻量级图片标注库让你的Web应用瞬间提升交互体验
前端
二十雨辰4 小时前
vite性能优化
前端·vue.js
明月与玄武4 小时前
浅谈 富文本编辑器
前端·javascript·vue.js
paodan4 小时前
如何使用ORM 工具,Prisma
前端
布列瑟农的星空4 小时前
重学React——memo能防止Context的额外渲染吗
前端
FuckPatience4 小时前
Vue 与.Net Core WebApi交互时路由初探
前端·javascript·vue.js
小小前端_我自坚强5 小时前
前端踩坑指南 - 避免这些常见陷阱
前端·程序员·代码规范
lichenyang4535 小时前
从零实现JSON与图片文件上传功能
前端
WebGirl5 小时前
动态生成多层表头表格算法
前端·javascript