学习Java的日子 Day44 初识前端

Day44 HTML

学习路线:

在这里插入图片描述

前端:展示页面、与用户交互 — HTML

后端:数据的交互和传递 — JavaEE/JavaWeb

1.B/S和C/S

B/S:浏览器/服务器 教务系统

C/S:客户端/服务器

优缺点

1.开发/维护成本:B/S相对低

2.运算负载:C/S可以使用客户端分担压力

3.安全性:专人专用客户端(银行) C/S

2.【面试】网页的呈现过程

URL验证 --> DNS解析 --> TCP三次握手(建立连接) --> 处理请求 --> 渲染页面 --> 断开连接

3.【重点】URL格式

协议://主机地址(域名或IP地址):端口号/资源路径?参数名1=参数值1&参数名2=参数值2&……#书签(信息片段)

eg: https://www.baidu.com:443

3.1 协议

1.http 超文本传输协议

2.https 在链路层上套接字加密的超文本传输协议(安全的http)

3.ftp 文件传输协议

3.2 ip地址

本机ip地址 127.0.0.1 localhost

3.3 端口号

1.http默认端口 80

2.MySQL端口 3306

3.Tomcat 服务器容器 8080

3.4 URL、URI、URN

1.URL 统一资源定位器

2.URI 统一资源标识(ID)

3.URN 统一资源命名

注意

1.URI范围最大

2.URL不支持中文

3.5 MIME 一级类型/二级类型

1.text 文本 text/html

2.image 图像 image/jpg image/png

3.audio 音频

4.video 视频

5.application 应用

6.message 报文信息

7.multipart 多部分媒体(文件上传)eg. 用户注册

4.网页的组成部分(HTML+CSS+JavaScript)

前端开发的工作模式:开发输出html+css+js

HTML:页面结构
CSS:页面样式表现
JavaScript:交互行为

在这里插入图片描述

5.HTML简介

HTML:超文本标记语言——HyperText Markup Language

超文本:链接

标记语言:标记网页的结构和内容

标记:标签,带尖括号的文本

5.1 HTML特点

1.解释性语言 VS 编译性语言(C、java)

2.浏览器解释执行(依赖于浏览器)

3.所有不可见全部会被解析为一个空白符

4.不区分大小写(建议小写)

6.HTML基本结构

html:整个网页

head:网页头部,用来存放给浏览器看的信息,例如 CSS

title:网页标题

body:网页主体,用来存放给用户看的信息,例如图片、文字

在这里插入图片描述

注意:

标签要成对出现,中间包裹内容

<>里面放英文字母(标签名)

结束标签比开始标签多 /

标签分类:双标签和单标签

7.扩展:颜色的表示方法

1.英语单词 red

2.#十六进制RGB(#000000——#FFFFFF) #FFF

3.(CSS) rgb(0,0,0) - rgb(255,255,255)

8.路径的编写【掌握】

1.绝对路径:路径很清晰—写很多内容—应用:引用第三方资源(网络)

2.相对路径:相对于当前的URL—书写简单—应用:项目内部

    1. 同一目录:直接写文件名.后缀名 eg. note.md
  1. 上级目录:…/文件名.后缀名 eg. …/…/README.md
  2. 下级目录: 文件夹名字/文件名.后缀 eg. img/baidu.png

3.相对服务器路径:/开头 表示服务器根路径(Web开发中常用)

    1. 同一目录:直接写文件名.后缀名 eg. note.md
  1. 上级目录:…/文件名.后缀名 eg. …/…/README.md
  2. 下级目录: 文件夹名字/文件名.后缀 eg. img/baidu.png

3.相对服务器路径:/开头 表示服务器根路径(Web开发中常用)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/10326.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

IPv6资产测绘哪家强?揭秘新一代网络空间资产测绘平台的独门秘籍

网络空间资产测绘&#xff0c;即通过一系列技术手段&#xff0c;对网络中的各类资产进行全面的发现、分类和定位&#xff0c;为各类用户提供精准的数据支撑和决策依据。网络空间资产测绘作为一门新兴的交叉学科&#xff0c;融合了计算机网络技术、数据挖掘、人工智能、信息安全…

解构复合人工智能系统(Compound AI Systems):关键术语、理论、思路、实践经验

编者按&#xff1a; 大模型的出现为构建更智能、更复杂的人工智能系统带来了新的契机。然而&#xff0c;单一的大模型难以应对现实世界中错综复杂的问题&#xff0c;需要与其他模块相结合&#xff0c;构建出复合人工智能系统&#xff08;Compound AI Systems&#xff09;。 本文…

Python经典案例爬取豆瓣Top250电影数据

随着网络数据的日益丰富&#xff0c;如何从海量的信息中快速、准确地提取出有价值的数据&#xff0c;成为了许多开发者和技术爱好者关注的焦点。在这个过程中&#xff0c;网络爬虫技术凭借其强大的数据获取能力&#xff0c;成为了数据分析和挖掘的重要工具。本文将通过一个经典…

学习笔记:IEEE 1003.13-2003【POSIX PSE53接口列表】

一、POSIX PSE53接口列表 根据IEEE 1003.13-2003&#xff0c;整理了POSIX PSE53接口API&#xff08;一共126个&#xff09;&#xff0c;每个API支持链接查看。 IEEE POSIX接口online搜索链接&#xff1a; The Open Group Base Specifications Issue 7, 2018 edition 详细内…

修改表空间对应数据文件的大小

Oracle从入门到总裁:​​​​​​https://blog.csdn.net/weixin_67859959/article/details/135209645 表空间与数据文件紧密相连&#xff0c;相互依存&#xff0c;创建表空间的时候需设置数据文件大小。 在后期实际应用中&#xff0c;如果实际存储的数据量超出事先设置的数据…

1.5编程基础之循环控制 04:求整数的和与均值

总时间限制: 1000ms 内存限制: 65536kB 描述 读入n&#xff08;1 < n < 10000&#xff09;个整数&#xff0c;求它们的和与均值。 输入 输入第一行是一个整数n&#xff0c;表示有n个整数。 第2~n1行每行包含1个整数。每个整数的绝对值均不超过10000。 输出 输出…

Spring-Bean 作用域

作用域 作用域案例 public class BeanScopeDemo {AutowiredQualifier("singletonPerson")Person person;AutowiredQualifier("prototypePerson")Person person1;AutowiredQualifier("prototypePerson")Person person2;AutowiredSet<Person&g…

程序环境和预处理、编译链接过程、编译的几个阶段、运行环境、预定义符号等的介绍

文章目录 前言一、程序的翻译环境和执行环境二、编译链接过程三、编译的几个阶段四、运行环境五、预定义符号总结 前言 程序环境和预处理、编译链接过程、编译的几个阶段、运行环境、预定义符号的介绍。 一、程序的翻译环境和执行环境 在 ANSI C 的任何一种实现中&#xff0c…

解决了这个报错User{code: 0, msg: ‘params pid Missing‘, time: ‘1715421706‘, data: null}

这个报错的意思是参数 pid 缺失。在你的代码中&#xff0c;有一个请求或操作需要传递参数 pid&#xff0c;但是没有正确传递或设置这个参数&#xff0c;导致系统无法识别或处理这个请求。 要解决这个问题&#xff0c;你可以检查代码中是否有包含需要传递 pid 参数的请求或操作…

知识付费系统源码定制开发,政策规范后的研学旅行要如何发展?

9月&#xff0c;武汉市旅游发展委员会联合武汉市教育局公布《服务机构评定与服务规范》、《研学基地评定与服务规范》和《研学导师评定与服务规范》3个考评标准&#xff0c;对武汉市中小学生研学旅行标准作出了详细规定。 在此之后&#xff0c;广东省发布《关于推进中小学生研学…

BigDecimal类型引用传递

在Java中,所有的对象包括BigDecimal都是通过引用传递的。这意味着当你将一个对象作为参数传递给一个方法时,实际上传递的是这个对象在内存中的地址(引用),而不是对象本身。因此,如果方法内部对这个引用所指向的对象进行了修改,那么方法外部的原始对象也会受到这个修改的…

CLIP 浅析

CLIP 浅析 文章目录 CLIP 浅析概述如何训练CLIP如何使用Clip进行图像分类优缺点分析优点缺点 概述 CLIP的英文全称是Contrastive Language-Image Pre-training&#xff0c;即一种基于对比文本-图像对的预训练方法或者模型。 如何训练CLIP CLIP包括两个模型&#xff1a;Text …

【数据结构】顺序表与链表的差异

顺序表和链表都是线性表&#xff0c;它们有着相似的部分&#xff0c;但是同时也有着很大的差异。 存储空间上的差异&#xff1a; 对于插入上的不同点&#xff0c;顺序表在空间不够时需要扩容&#xff0c;而如果在使用realloc函数去扩容&#xff0c;会有原地扩容和异地扩容两种情…

Spring Security基础教程:从入门到实战

作者介绍&#xff1a;✌️大厂全栈码农|毕设实战开发&#xff0c;专注于大学生项目实战开发、讲解和毕业答疑辅导。 推荐订阅精彩专栏 &#x1f447;&#x1f3fb; 避免错过下次更新 Springboot项目精选实战案例 更多项目&#xff1a;CSDN主页YAML墨韵 学如逆水行舟&#xff0c…

电脑复制和粘贴的时候会出现Hello!

电脑不管是Microsoft Excel还是Microsoft Word复制之后粘贴过来就出现HELLO&#xff0c;当复制粘贴文件的时候就会出现WINFILE&#xff1b; 具体现象看下面两个图片&#xff1a; 这是因为winfile 文件病毒&#xff08;幽灵蠕虫病毒&#xff09;,每月的28号发作&#xff1b; 症状…

Ajax原理是什么,怎么实现?

Ajax是在不需要重新加载整个网页的情况下&#xff0c;与服务器交换数据并且更新部分网页的技术。 Ajax的原理就是通过XMLHttpRequest对象来向服务器发起异步请求&#xff0c;从服务器获取数据&#xff0c;然后用JavaScript来操作DOM实现更新页面。 实现Ajax异步交互&#xff…

wangEditor富文本编辑器与layui图片上传

记录&#xff1a;js 显示默认的wangEditor富文本编辑器内容和图片 <style>body {background-color: #ffffff;}.layui-form-select dl{z-index:100000;} </style> <div class"layui-form layuimini-form"><div class"layui-form-item"…

ubuntu系统在有无NVIDIA驱动下查看显卡型号

在ubuntu系统下&#xff0c;分别在有nvidia显卡驱动和无nvidia显卡驱动时&#xff0c;查看nvidia显卡型号。 1、有nvidia显卡驱动时的查看方式 nvidia-smi -L会显示如下信息&#xff1a; GPU 0: NVIDIA GEForce GTX 1660 SUPER (UUID: GPU-*****)2、无nvidia显卡驱动时的查看…

【Linux】从零开始认识动静态库 -动态库

送给大家一句话&#xff1a; 我不要你风生虎啸&#xff0c; 我愿你老来无事饱加餐。 – 梁实秋 《我把活着欢喜过了》 ଘ(੭ˊᵕˋ)੭* ੈ✩‧₊˚ଘ(੭ˊᵕˋ)੭* ੈ✩‧₊˚ଘ(੭ˊᵕˋ)੭* ੈ✩‧₊˚ ଘ(੭ˊᵕˋ)੭* ੈ✩‧₊˚ଘ(੭ˊᵕˋ)੭* ੈ✩‧₊˚ଘ(੭ˊᵕˋ)੭…

架构每日一学 4:成为首席架构师,你必须学会顺应人性

本文首发于公众平台&#xff1a;腐烂的橘子 架构师生存法则之二&#xff1a;架构活动需要顺应人性 程序员入行的第一天起就进入了一个机器的世界。在别人的眼中&#xff0c;程序员平时很少说话&#xff0c;更多的时间在和电脑打交道。 程序员工作时间久了大脑会被格式化&…