速通web前端的sun-----web前端三剑客之html

最新推荐文章于 2024-10-25 15:01:16 发布
最新推荐文章于 2024-10-25 15:01:16 发布
阅读量367 收藏
点赞数
分类专栏： 速通web前端 文章标签： 前端 html javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/pinenutssg1/article/details/121784834
版权

目标:能够独立完成pc端和移动端的网页布局

笔记均来自尚硅谷：http://www.atguigu.com/，记录，加深印象。
每个知识点都需要勤加练习，每天进步一点点，共勉。

  1. 什么web?
    Web是一个简写, world wide web 万维网,广域网,互联网
    我们可以理解web就是网站

  2. 什么是网站和网页?
    网站是多个网页和其他文件组成的

  3. 什么是web的前端和后端?
    在这里插入图片描述

  4. 前端要掌握的技术?

    html css javascript

  5. 网页的组成
    html: 文本 按钮 输入框 图片 超链接 音频 视频…
    css: 对网页进行装饰
    Js: 网页的动态效果

  6. 浏览器
    在这里插入图片描述

ie: trident内核
Firefox: 火狐 gecko内核
opear: webkit 内核
safari: webkit 内核
chrome: webkit内核一个分支blink内核
在学习和工作时,都用chrome

  1. Web标准
    结构: html
    表现: css
    行为: javascript
    是由w3c(万维网联盟组织)组织制定的

  2. 开发工具
    在这里插入图片描述

8.1.

Hbuilder基本使用

8.2. 创建项目
8.2.1. 第一种方式
在这里插入图片描述
在这里插入图片描述

8.2.2. 第二种方式

将项目文件夹直接拖拽到项目管理器中

8.2.3. 第三种方式
在这里插入图片描述
8.3. 移除项目

在这里插入图片描述
在这里插入图片描述
从项目管理器中移除,本地硬盘还是有的

  1. html简介
    在这里插入图片描述
    在这里插入图片描述

html5是一个新的html版本,新增了一些标签和功能,适用于高级浏览器
H5专业是一个泛指,指的就是移动端的意思

  1. html基本标签
    <!DOCTYPE html>文档类型的声明,让浏览器按照相应版本的html进行解析
    html:网页的根标签,所有其它的标签都被包含
    head:头部标签,关于网页的一些配置信息
    <meta charset=“utf-8”>:字符集设置或者叫编码设置
    在这里插入图片描述
    在这里插入图片描述
    title:标题标签
    body: 主体标签,所有在浏览器中显示的其他的内容和标签都被包含

  2. seo搜索引擎优化
    在这里插入图片描述
    让爬虫搜索到的关键词和描述信息

  3. 标签的类型
    双标签: 有开始有闭合.例如:
    单标签(自结束标签). 例如:

  4. 标签的关系
    嵌套关系: 包好关系,是祖先和后代之间的关系
    并列关系: 同级关系,是兄弟之间的关系

  5. html常用标签
    h1-h6: 标题标签
    hr:水平线标签
    p: 段落标签
    br:换行标签

  1. 图片标签
    在这里插入图片描述

  2. 路径
    在这里插入图片描述

16.1 相对路径
16.1.1 同级相对路径
在这里插入图片描述
16.1.2 下一级相对路径
在这里插入图片描述
16.1.3. 上一级相对路径

16.2 绝对路径
在这里插入图片描述

小结：这里老师使用的是HBuilder，但是后面还是需要换成主流的VSCode，所以我就直接使用VSCode了。
在这里再推荐一个前端学习网站：（千古前端）https://web.qianguyihao.com/

松果pine吃玉米
关注
专栏目录
Web:前端入门到进阶图文教程，超详细的Web前端学习笔记。从零开始学前端，做一名精致优雅的前端工程师。公众号「千古壹号」作者
05-10
前端入门到进阶图文教程，超详细的 Web 前端学习笔记。从零开始学前端，做一名精致优雅的前端工程师。 项目地址 GitHub地址： 我的前端教程长期免费，不玩猫腻，不会设置任何套路，暂时也没打算做成付费内容，因为我相信启蒙的重要性。 如果你发现本项目有内容上的错误，欢迎在 GitHub 提交 issues 或者 pull requests 进行指正，方便归档。 由于 GitHub 是国外的网站，如果你发现网站访问较慢，或者文中的部分图片加载不出来，不妨。 项目介绍 前端入门到进阶图文教程。从零开始学前端，做一名精致的前端工程师。持续更新中。本项目的主要作用有： 1、网上的大部分入门教程，都不太适合初学者，本项目争取照顾到每一位前端入门者的同理心。即使你完全不懂前端，甚至不懂编程，通过这个教程，也能让小白入门。 2、帮助前端同学提供一个精品学习资源和路线，提高学习效率，少走很多弯路。 3、可
前端学习（三）
qq_44529689的博客
01-13 1072
第一part——HTML。
【前端基础篇】HTML零基础速通
半截诗的博客~
08-21 1832
就其核心而言，HTML 是一种相当简单的、由不同元素组成的标记语言，它可以被应用于文本片段，使文本在文档中具有不同的含义（它是段落吗？它是项目列表吗？它是表格吗？），将文档结构化为逻辑块（文档是否有头部？有三列内容？有一个导航菜单？），并且可以将图片，影像等内容嵌入到页面中。本模块将介绍前两个用途，并且介绍一些 HTML 的基本概念和语法。 前言 尽管你无需事先拥有任何 HTML 相关知识以学习该模块，你仍至少需要熟悉一些使用电脑的基础知识，并会被动地使用网络（也就是看着它，浏览内容）。你需要配置基础的开
六天速通javaweb（后续深入学在这丰富）
fangshyv的博客
01-11 218
除了上面那三个方法，还有两个，但是不常用geetServletInfo：返回版权等信息的，我们一般就直接return ”“；空字符串就行getServletConfig：返回一个ServletConfig对象。什么是重定向？——浏览器访问资源A ，A处理不来要B处理。然后A给浏览器一个重定向响应（302状态码），意思是告诉你这个请求我处理不了，你去找资源B，资源B的路径也会随着重定向在响应头里返回//设置响应状态码302//设置响应头Location（value位资源B的地址）
千古前端图文教程项目使用指南
gitblog_01179的博客
10-11 696
千古前端图文教程项目使用指南 Web 千古前端图文教程，超详细的前端入门到进阶知识库。从零开始学前端，做一名精致优雅的前端工程师。 项目地址: https://gitcode.com/gh_mirrors/we/Web ...
千古前端图文教程 - 从入门到进阶全面指南
gitblog_00045的博客
05-28 319
千古前端图文教程 - 从入门到进阶全面指南 Web 千古前端图文教程，超详细的前端入门到进阶知识库。从零开始学前端，做一名精致优雅的前端工程师。 项目地址: https://gitcode.com/gh_mirrors/we/Web ...
Web前端开发技术-初识JavaScript.pptx
07-07
JavaScript是Web前端开发的核心技术之一，它是一种功能强大的编程语言，专为创建交互式Web页面而设计。在当今数字化世界中，JavaScript几乎无处不在，无论是个人电脑还是移动设备上的网页，其丰富的交互效果和动态...
Web-UI框架需求.doc
12-03
Web UI框架需求是构建高效、美观且用户友好的Web应用程序的关键组成部分。此文档详细阐述了深圳市泽宝网络科技有限公司对于Web UI框架的需求，旨在提供一套统一的界面标准和交互设计，以提升用户体验并优化开发流程...
JSP.rar_web-inf
09-23
JSP是由Sun Microsystems公司推出的，现在已成为Oracle公司的一部分，是Java EE（Enterprise Edition）的一部分。JSP的核心思想是将静态内容（HTML、CSS、JavaScript）与动态内容（Java代码）分离，使得开发者可以更...
sun6i-mipi-csi
10-16
sun6i-mipi-csi
SpringMVC如何访问WEB-INF jsp过程解析
10-14
在尝试访问`WEB-INF/jsp`页面时，可能会遇到如下的错误提示：“The absolute uri: http://java.sun.com/jsp/jstl/core cannot be resolved in either web.xml or the jar files deployed with this application”。...
Web：前端入门到进阶图文教程，超详细的Web前端学习笔记。从零开始学前端，做一名精致优雅的前端工程师。公众号“千古壹号”作者
02-03
项目介绍 项目地址： : 从零开始学尖端，做一名精致的前端工程师。持续更新中。本项目的主要作用有： 1，网上的大部分入门教程，都不太适合初学者，本项目有望照顾到每一位前端入门者的同理心。甚至你完全不懂前端，甚至不懂编程，通过这个教程，也能让小白入门。 2，帮助初级同学提供一个精品学习资源和路线，提高学习效率，少走很多弯路。 3，可以当做前端字典，随时翻阅，查漏补缺。 维护这个项目的初衷，可以看这篇文章： 前端入门路线和推荐学习资源，可以看这篇文章： 项目指引 由于GitHub是国外的网站，如果您发现网站访问较慢，或者文中的部分图片加载不出来，不妨。 如果您发现本项目有内容上的错误，欢迎提交问题进行指正。 学习交流 如果你还想学习更多技能，不妨关注我的微信公众号：千古壹号。 扫一扫，你将发现一个全新的世界，而这将是一场美丽的意外：
前端学习路线
lie_sun
10-19 449
【前端面试】06 类的定义和继承的几种方式
微子细的博客
08-22 398
本文笔记基于「千古壹号」的GitHub项目：https://github.com/qianguyihao/web 文章目录1.考点2.解决方法2.1 类的声明2.2 生成实例2.3 继承的几种方式 1.考点 类的声明 生成实例 如何实现继承？继承的本质就是原型链 继承的几种方式 2.解决方法 2.1 类的声明 传统写法，构造函数法 function Animal1() { ...
速通web前端的sun-----web前端三剑客之css
pinenutssg1的博客
12-08 416
每个知识点都需要勤加练习，每天进步一点点，共勉。 Chrome调试 1.1. 调试css <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,.
2019年前端五大布局，你学会了多少？
热门推荐
湮顾千古的博客
01-05 1万+
一、静态布局 静态布局就是传统的网站形式，网页上的所有元素的尺寸一律使用px作为单位。 1.布局特点 不管浏览器尺寸具体是多少，网页布局始终按照最初写代码时的布局来显示。常规的pc的网站都是静态（定宽度）布局的，也就是设置了min-width，这样的话，如果小于这个宽度就会出现滚动条，如果大于这个宽度则内容居中外加背景，这种设计常见于pc端。 2.设计方法 --------PC----...
前端学习（六）
qq_44529689的博客
01-26 1867
学了html，部分css，知识点多了，已经有点混乱了，本来打算理论知识都看完再打代码的，现在决定先打代码，省得到后面越积越多。
WEBRTC教程:局域网怎么调试，http://172.19.18.101:8080 ,无法访问摄像头和麦克风，请检查权限
最新发布
keyboard专栏
10-25 1105
在局域网中使用 WebRTC 时，无法访问摄像头和麦克风通常是因为浏览器的安全策略限制了API 的使用。如果你在非localhost或非 HTTPS 环境下访问网页，浏览器会阻止访问摄像头和麦克风。localhost大多数浏览器允许在localhost上使用，即使没有 HTTPS。所以你可以在服务器和客户端同一台机器上使用localhost进行测试。如果你需要在局域网的 IP 地址上（如）进行访问，那么使用 HTTPS 是解决方案之一。通过配置 HTTPS，你可以避免浏览器的安全限制。使用openssl。
JAVA-WEB开发入门：21天学习指南
"21天学通JAVA-WEB开发教程，主要涵盖了如何在Windows环境下搭建JAVA开发环境，包括安装JDK、Tomcat服务器以及Eclipse与MyEclipse插件的配置和使用，旨在帮助初学者快速入门JAVA-WEB开发。" 在深入学习JAVA-WEB开发...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值