HTML笔记(1)

news2024/12/25 9:43:08

介绍

 

  • 浏览器中内置了HTML的解析引擎,通过解析标记语言来展现网页;
  • HTML标签都是预定义好的
  • Java工程师:后台代码的编写,和数据库打交道,把数据给网页前端的工程师
  • 网页前端工程师:写HTML页面,它们拿到数据就可以把数据展现到页面上,呈现给用户;
  • 两类人联合起来开发软件的系统
  • W3C是万维网联盟:它们是定义标准的一个组织,它们规定一个网页由三部分组成,这三部分是网页的结构、网页的表现、以及网页的行为;分别对应了三种不同的语言来去定义这三种不同的组成部分。

       HTML - 定义网页的结构

       CSS - 定义网页的表现

       JavaScript - 定义网页的行为

       这三种语言被称为网页前端三剑客

基础标签

创建网页项目

新建模块(项目)→ 选择创建路径 → 编辑名称 → 创建目录 → 编辑目录名称为html → 创建html文件

在IDEA(Java工程师用)

不需要src目录,把它删去

在WebStorm(前端工程师用)

细节

注意

· 回车、换行、空白字符等都是不被页面所识别的,如需换行需要手动添加<br>标签。

  • · html要显示特殊字符,需要用特殊的转义字符。

图片、音频、视频标签

其他的音视频格式html暂时不支持

资源路径

1、绝对路径:完整路径

2、相对路径:(两个资源的)相对位置关系(*当前页面访问的路径;*当前资源访问的路径)

        情况一:在同一目录下   ./a.jpg      a.jpg

        页面访问:xxx(访问项目,怎么写无所谓)/html/02-图片音频视频.html

        资源访问:xxx/html/a.jpg

        情况二:在同一目录下的其他目录中   ./img/a.jpg      img/a.jpg

        页面访问:xxx/html/02-图片音频视频.html

        资源访问:xxx/html/img/a.jpg

        情况三:资源所在的目录和页面所在的目录为同级   ../img/a.jpg

        页面访问:xxx/html/02-图片音频视频.html

        资源访问:xxx/img/a.jpg

        需要找到页面的上一级目录(html),html目录和img目录在同一级,这时再通过img目录下找到资源(a.jpg),所以要通过html文件找到资源,就要首先找到它的上一级(用../表示,就到了html目录),再找同级的img,再拿资源就可以了,也就是   ../img/a.jpg

        当资源改变路径时,webstorm会同步更改代码中引用的路径。

 

示例代码

总结

超链接标签

在页面内部跳转会用_self;跳转到新的页面会用_blank。

示例代码

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

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

相关文章

拯救者Y9000K无线Wi-Fi有时不稳定?该如何解决?

由于不同品牌路由器的性能差异&#xff0c;无法完美兼容最新的无线网卡技术&#xff0c;在连接网络时&#xff08;特别是网络负载较大的情况下&#xff09;&#xff0c;可能会出现Wi-Fi信号断开、无法网络无法访问、延迟突然变大的情况&#xff1b;可尝试下面方法进行调整。 1…

go 如何知道一个对象是分配在栈上还是堆上?

如何判断变量是分配在栈&#xff08;stack&#xff09;上还是堆&#xff08;heap&#xff09;上&#xff1f; Go和C不同&#xff0c;Go局部变量会进行逃逸分析。如果变量离开作用域后没有被引用&#xff0c;则优先分配到栈上&#xff0c;否则分配到堆上。判断语句&#xff1a;…

Stable Doodle:Stability AI推出的一款零门槛AI绘画神器

Stable Doodle是由Stability AI推出的一款零门槛AI绘画神器&#xff0c;可以将简单的草图转化为精美的图像。它可以将随手的塗鴉草稿转化为高畫質的完成圖&#xff0c;让用户能够以更快的速度将想法转化为精美的艺术作品。Stable Doodle利用最新的Stable Diffusion模型&#xf…

智能车域控制器设计

摘要: 本文主要针对ADCU从硬件设计到软件设计的开发流程进行详细阐述,主要包含了需求场景、关键硬件电路、电路可靠性、AUTOSAR架构、CAN通信简介、CAN通信软件设计等。最后基于以上硬件技术和软件技术开发出一款产品级智能驾驶域控制器。 // 智能驾驶域控制器研究现状 //…

iOS开发-实现自定义Tabbar及tabbar按钮动画效果

iOS开发-实现自定义Tabbar及tabbar按钮动画效果 之前整理了一个继承UITabbarController的Tabbar效果 查看 https://blog.csdn.net/gloryFlow/article/details/132012628 这里是继承与UIViewController的INSysTabbarViewController实现及点击tabbar按钮动画效果。 一、INSysT…

学习记录——TransNormerLLM

Scaling TransNormer to 175 Billion Parametes 线性注意力的Transformer大模型 2023 Transformer 存在局限。首要的一点&#xff0c;它们有着对于序列长度的二次时间复杂度&#xff0c;这会限制它们的可扩展性并拖累训练和推理阶段的计算资源和时间效率。 TransNormerLLM 是首…

中小企业如何低成本实施MES管理系统

中小企业在市场竞争中需要有高效的管理体系来支持其运营和发展。中小企业MES管理系统是一种先进的管理系统&#xff0c;可以提升工厂智能化水平&#xff0c;提高生产效率&#xff0c;是中小企业必须采取的有效管理工具。然而&#xff0c;由于资金和技术的限制&#xff0c;中小企…

Java API指南:掌握常用工具类与字符串操作

文章目录 1. API简介2. Java API的使用2.1 创建和使用Java API工具类2.2 使用String类进行字符串操作 结语 导语&#xff1a; Java作为一门功能强大的编程语言&#xff0c;其成功之处不仅在于语法结构的简洁明了&#xff0c;更因为其丰富的API&#xff08;Application Programm…

面向对象中的多态性

一、权限修饰符 public, 缺省&#xff0c; protected&#xff0c;private 二、this和super关键字 this:表示当前对象 super:表示父类声明的成员 原则&#xff1a;遵循就近原则和追根溯源原则。 三、Object类 java.lang.Object类是所有java类的超类&#xff0c;即所有的J…

微信小程序测试要点

一、什么是小程序&#xff1f; 可以将小程序理解为轻便的APP&#xff0c;不用安装就可以使用的应用。用户通过扫一扫或者搜索的方式&#xff0c;就可以打开应用。 小程序最主要的特点是内嵌于微信之中&#xff0c;而使用小程序的目的是为了能够方便用户不在受下载多个APP的烦…

更好搭建负载测试环境的六个技巧

如果你如我昨天谈到的客户一样&#xff0c;花费了24到48个小时用于每个负载测试环境的搭建&#xff0c;那你的测试及构建部署能力绝对是受限的。 搭建一个仿真测试环境对于做好负载测试非常重要&#xff0c;同时它也是一个非常具有挑战性的任务&#xff0c;需要考虑技术解决、…

2023 7-31

题目1 寻找不同二叉树两节点的公共祖先 递归解法 仔细看这个解法更加容易理解: l、r 非空时,说明 p、q 分居 root 的两侧,root 就是 LCAl、r 任一为空,说明 LCA 位于另一子树或其祖先中代码 /*** Definition for a binary tree node.* struct TreeNode {* int val;* …

展锐USB充电图标更新流程

介绍 power_supply 目录下online节点是用于判断是否插入battery、ac(外部电源) 和USB 的节点&#xff0c;目录在sys/class/power_supply/battery(ac、usb)/online&#xff0c;主要用于在StatusBar 上显示充电的闪电图标。 SystemUI层介绍 流程介绍 在SystemUI 中控制充电图…

【ChatGPT辅助学Rust | 基础系列 | 基础语法】变量,数据类型,运算符,控制流

文章目录 简介&#xff1a;一&#xff0c;变量1&#xff0c;变量的定义2&#xff0c;变量的可变性3&#xff0c;变量的隐藏 二、数据类型1&#xff0c;标量类型2&#xff0c;复合类型 三&#xff0c;运算符1&#xff0c;算术运算符2&#xff0c;比较运算符3&#xff0c;逻辑运算…

Redis系列二:Clion+MAC+Redis环境搭建

1. ClionMACRedis-3.0-annotated环境搭建 参考&#xff1a; https://github.com/huangz1990/redis-3.0-annotated https://gitee.com/dumpcao/redis-3.0-annotated-cmake-in-clion https://tool.4xseo.com/a/12910.html 1.1 下载并导入Clion git clone https://gitee.com/dum…

基于SSM+JSP+LayUI的校园任务帮管理系统

校园帮项目 校园即时服务平台 用户角色 管理员 功能 登录、公告管理&#xff08;发布公告、停用公告&#xff09;、任务管理&#xff08;下架任务、删除任务&#xff09;、用户管理&#xff08;用户充值、限制用户&#xff09;、修改密码 用户角色 用户 功能 注册、登录…

Allied Telesis 证实 AR4050S-5G 路由器已成功通过 Splashtop On-Prem 快速处理现场数据

日本东京 —— Allied Telesis Inc. 和 NTT Comware Corporation 很高兴地宣布&#xff0c;Allied Telesis AR4050S-5G 路由器经证实已与 Splashtop On-Prem 解决方案成功集成&#xff0c;可安全快速地处理现场数据。根据测试结果&#xff0c;使用该方案&#xff0c;可以在实地…

dolphinscheduler switch+传参无坑版

dolphinscheduler 的前后传参有较多的坑&#xff0c;即便是3.0.5版本仍然有一些bug 下面是目前能无坑在3.0.5版本上使用的操作 前置任务 在界面上设置变量和参数名称 跟官方网站不一样&#xff0c;注意最后一行一定使用echo ${setValue(key$query)}的方式&#xff0c;注意引…

一次web网页设计实践——checkbox单选、复选功能的实现

由于工作内容原因近期做了一个网页&#xff0c;记录下。 需求&#xff1a; 写一个如下的页面&#xff0c;包括checkbox单选&#xff0c;checkbox多选&#xff0c;slect&#xff0c;text等控件 内容&#xff1a; 一、checkbox &#xff08;Wlan 开关&#xff09; 要求&#x…

基于Java+SpringBoot制作一个学生公寓管理小程序

制作一个学生公寓管理小程序,旨在优化和简化学生公寓的日常管理工作。该系统涵盖了各种功能模块,以满足学生住宿的需求,同时提供方便、高效的管理方式,该系统包含用户管理、卫生评比、来访登记、宿舍报修等模块。 一、小程序1.1 项目创建1.2 首页轮播图快捷导航iconfont图标…