day 44
前端
什么是前端
任何与用户直接打交道的操作界面 都可以称之为前端
eg：电脑界面 手机界面 平板界面
什么是后端
真正的幕后操作者
web服务的本质
请求 响应
浏览器输入网址 回车发生了哪些事
1.朝着指定的服务器地址发送请求
2.服务端接收请求 并处理
3.返回相应的响应
4.浏览器接收并渲染出好看的页面 给用户看
请求方式
1.get请求
朝服务器要资源
eg:敲www.baidu.com
2.port请求
朝服务器提交数据
eg:登录功能
HTTP协议
超文本传输协议
规定了服务端与浏览器数据传输的数据格式
1.四大特性
1.基于TCP/IP作用与应用层之上的协议
2.基于请求响应
请求对应响应
3.无状态
不保存客户端状态
无论来多少次 都当你如初见
cookie session
4.无连接
长连接 websocket 聊天室
2.数据格式
请求格式
请求首行（请求方式 协议版本）
请求头（一大堆k:v键值对）
请求体（敏感信息 密码 身份证号）
响应格式
响应首行（请求方式 协议版本）
响应头（一大堆k:v键值对）
响应体（给用户看的数据）
响应状态码
用数字来表示一串文字需要表达的意思
1XX：服务端已经成功接收到你的请求 正在处理 你可以继续提交其他数据
2XX：服务端成功响应了相应的数据（200）
3XX：重定向
4XX：（404请求资源不存在） （403你当前不符合某一些条件 无法正常访问）
5XX：服务器内部错误（500）
HTML
超文本标记语言，是一种标识性的语言，包括一系列标签。
文件的后缀名
文件的后缀名是给人看的，对于计算机来说，全都是二进制；之所以不同的后缀名有不同的功能，是程序员人为定制的
HTML的注释
注释是代码之母
<!--单行注释-->
<!--
多行注释1
多行注释2
多行注释3
-->
在搭建页面的时候，通常会利用注释来划分区域
<!--导航条开始-->
<!--导航条结束-->
<!--侧边栏开始-->
<!--侧边栏结束-->
HTML的文档结构
<html>
<head></head> 不是给人看的 给浏览器看的
<body></body> body内的代码才是给人看的
</html>
<h1>
hello world
</h1>
<a href="https://www.baidu.com">click me</a>
<img src=src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1573566230133&di=590ab12707a1d494be7ec784801076d8&imgtype=0&src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fitem%2F201207%2F04%2F20120704211148_3UWwd.jpeg"/>
标签的分类1
1.双标签（h1,a）
2.自闭合标签（img）
head内常用标签
title 定义网页标题
style 内部支持写css代码
link 引入外部css样式文件
script 内部可以直接写js代码，也可以引入外部js文件
meta 定义网页源信息
<meta name="keywords" content="meta总结，html meta,meta属性，meta跳转">
<meta name="description" content="老男孩python学院">
浏览器上所看到的花里胡哨的页面，背后都是HTML代码而已
body内常用标签
h1-h6 标题标签
p 段落标签 一个p就是一行内容
s 删除线
b 加粗
u 下划线
i 斜体
br 换行
hr 一条分割线
body内特殊符号
空格
&； &
¥ ￥
> >
< <
© ©
® ®
标签的分类2
1.块级标签
h1-h6、p、br、hr、div
独占一行
- 块级标签内可以嵌套其他块儿级的行内标签
- 注意：
p标签虽然是块级标签，但是他的内部不能嵌套任何块儿级标签，只能嵌套行内标签(***)
2.行内标签
s 、i、u、b、span
内部文本多大，就占多大
行内不能嵌套行内和块级标签
********************************************************
标签通常应该有两个属性
id 就类似于身份证号，每一个标签，都应该有id值，并且在同一个html文档中，标签的id不能重复
class 类属性，有点类似于面向对象的继承，class = 'c1 c2 c3' 。这个标签就会拥有c1 c2 c3的所有样式
********************************************************
body内重要的标签
div 一块区域，可以往这块儿区域内填写任何内容
span
div和span是前期构建网页的基本骨架
a 链接标签
1.跳转功能
href参数控制跳转的地址
这个地址如果在你的机器上如果没有被点击过那么默认是蓝色
只要点过一次之后，之后颜色都是紫色
<!--<a href="https://www.sogo.com">点我点我</a>-->
a标签默认是在当前窗口跳转
你可以指定，新建窗口打开
target = "_self"
target = "_blank"
2.锚点功能
给a标签设置id值
然后再href中书写对应的a标签id值，点击即可跳转到对应的位置
<a href="" id>文章开头</a>
<div style="background_color: red;height: 1000px"></div>
<div style="background_color: green;height: 1000px"></div>
<div style="background_color: orange;height: 1000px"></div>
<a href="" id>文章中部</a>
<div style="background_color: black;height: 1000px"></div>
<div style="background_color: green;height: 1000px"></div>
<div style="background_color: orange;height: 1000px"></div>
<a href="#a1">回到顶部</a>
<a href="#a2">回到中部</a>
img 图片标签
src
1.图片地址，网上的地址也可以是你的本地图片地址
2.url(网址) 自动朝该网址发送get请求，获取图片资源
alt
当图片加载不出来的时候，展示的提示信息
title
鼠标悬浮上去展示的提示信息
width和height
这两个参数，只需设置一个，就可以默认是等比例缩放
两个全都调整的话，图片就会失真
列表标签
无序列表(***************)
ul
li
type参数
disc(实心圆点，默认值)
circle(空心圆圈)
square(实心方块)
none(无样式)
有序列表(了解)
ol
li
type参数
1 数字列表，默认值
A 大写字母
a 小写字母
I 大写罗马
i 小写罗马
标题列表(了解)
dl
dt 小标题
dd 小章节
表格标签
展示数据 一般都用到表格标签
<table>
<thead>
<tr>
<th>username</th>
<th>password</th>
<th>hobby</th>
<th>is delete</th>
</tr>
</thead>
</table>
<tbody>
<tr>
<td>tank</td>
<td>886</td>
<td>love</td>
<td>DBJ</td>
</tr>
</tbody>
day 44的更多相关文章
- PYOJ 44. 【HNSDFZ2016 #6】可持久化线段树
#44. [HNSDFZ2016 #6]可持久化线段树 统计 描述 提交 自定义测试 题目描述 现有一序列 AA.您需要写一棵可持久化线段树,以实现如下操作: A v p x:对于版本v的序列,给 A ...
- xwalk_core_library-15.44.384 .13.aar 百度云分享
xwalk_core_library-15.44.384.13.aar 这玩意下载很慢 特意放到百度,需要的可以通过百度下载 http://pan.baidu.com/s/1nt0Cmbn 下完后放到 ...
- 云计算之路-阿里云上：13:43-13:44之间RDS故障影响了全站的正常访问
抱歉!13:43-13:44之间,由于阿里云RDS(云数据库)出现2分钟突发故障,影响了全站的正常访问,给大家带来了麻烦,望大家谅解! 故障期间,应用程序日志中记录的错误信息如下: System.Da ...
- CentOS6.6安装virtualbox4.1.44
本人用的是centos6.6,安装了virtualbox 4.1.44,启动后一直如上图报错,哪位前辈如果解决过这样的问题,麻烦指点指点,小弟在此先谢过了.
- 将形如:Oct 8, 2016 5:29:44 PM串转换成正常时间在真机上遇到的坑
将形如:Oct 8, 2016 5:29:44 PM串转换成正常时间在真机上遇到的坑 /** * 根据传入字符串 * * @param str 传入的日期字符串 形如:Oct 8, 2016 5:29 ...
- (转)javascript 奇淫巧技44招
1.首次为变量赋值时务必使用var关键字 变量没有声明而直接赋值得话,默认会作为一个新的全局变量,要尽量避免使用全局变量. 2.使用===取代== ==和!=操作符会在需要的情况下自动转换数据类型.但 ...
- 每天一个linux命令（44）：top命令
top命令是Linux下常用的性能分析工具,能够实时显示系统中各个进程的资源占用状况,类似于Windows的任务管理器.下面详细介绍它的使用方法.top是一个动态显示过程,即可以通过用户按键来不断刷新 ...
- javascript 奇淫巧技44招
1.首次为变量赋值时务必使用var关键字 变量没有声明而直接赋值得话,默认会作为一个新的全局变量,要尽量避免使用全局变量. 2.使用===取代== ==和!=操作符会在需要的情况下自动转换数据类型.但 ...
- JACASCRIPT--的奇技技巧的44招
JavaScript是一个绝冠全球的编程语言,可用于Web开发.移动应用开发(PhoneGap.Appcelerator).服务器端开发(Node.js和Wakanda)等等.JavaScript还是 ...
- lambda的使用ret = filter(lambda x : x > 22 ,[11,22,33,44])
#!/usr/bin/env python #def f1(x) : # return x > 22 ret = filter(lambda x : x > 22 ,[11,22,33,4 ...
随机推荐
- navicat密码错误的问题
上集说到我的navicat打不开对吧..‘ 这下就来聊聊打开了的问题 下午非常开心,就打开了mysql的图形化界面, 但是,在我连接数据库的时候就报错了 错误就是密码错误那行 什么什么‘localho ...
- Debian 9 编译Python
Debian 9 编译Python 参考网址: https://solarianprogrammer.com/2017/06/30/building-python-ubuntu-wsl-debian/ ...
- 公告&留言板
这里是公告&留言板.无意义的评论可能会被删除. 2019.10.4 感觉开学之后状态一直都布星啊,可能会在博客里总结一些前面学的东西. 2019.10.14 咕咕咕咕咕咕咕咕 2019.10. ...
- IDEA中阿里P3C插件的安装与使用
在线安装: 离线安装: https://plugins.jetbrains.com/plugin/10046-alibaba-java-coding-guidelines/versions
- DevC++中的[Error]（不定期更新）
ld returned 1 exit status 程序是没有问题的,可能的问题最有可能是以下2个 1.是你的程序已经在运行,关闭原来的程序就可以正常了 2.你机器上有杀毒(安全)软件阻止了你程序的生 ...
- 动图+源码，演示 Java 中常用数据结构执行过程及原理
阅读本文大概需要 3.7 分钟. 作者:大道方圆 cnblogs.com/xdecode/p/9321848.html 最近在整理数据结构方面的知识, 系统化看了下Java中常用数据结构, 突发奇想 ...
- python笔记 面向对象编程从入门到高级
目录: 一.概念 二.方法 2.1组合 2.2继承 2.3多态 2.4封装 2.5归一化设计 三.面向对象高级 3.1 反射(自省) 3.2 内置方法__getatter__, __ ...
- WPF DataGrid 自定义样式 MVVM 删除 查询
看到很多小伙伴在找Dategrid样式 就分享一个 ,有不好的地方 请指出 代码部分都加了注释 需要的可以自己修改为自己需要的样式 源码已经上传 地址: https://github.com/YC ...
- yarn安装node-sass失败问题
注:使用 yarn install 命令安装依赖时报错 第一步:更改镜像源 yarn config set registry https://registry.npm.taobao.org -g 第二 ...
- Java 常用知识点汇总(数据类型之间转换、字符串的相关操作-截取、转换大小写等)
1.Java四类八种数据类型 byte:Java中最小的数据类型,在内存中占8位(bit),即1个字节,取值范围-128~127,默认值0 short:短整型,在内存中占16位,即2个字节,取值范围- ...