HTML简介、基本骨架、标签的关系、注释、路径

1

HTML

HTML超文本标记语言
超文本——链接
标记——标记也叫标签,带尖括号<>的文本

标签语法:
标签成对出现,中间包裹内容
<>里面放英文字母(标签名)
结束标签比开始标签多/
拓展:
双标签:成对出现的标签
单标签:只有开始标签,没有结束标签,例如<br>换行、<hr>水平线


HTML的基本骨架

<html>

    <head>

        <title>网页标题</title>

    </head>

    <body>

        网页主体

    </body>

</html>

html:整个网页
head:网页头部,存放给浏览器看的代码,例如CSS
body:网页主体,存放给用户看的代码,例如图片、文字
title:网页标题

Vs Code快速生成骨架:
在HTML文件中,!配合Enter/Tab键


标签的关系

作用:明确标签的书写位置;让代码更加整齐

1.父子关系(嵌套关系)
例如:html标签内嵌套head标签
html称为父标签,head称为子标签

2.兄弟关系(并列关系)
例如:head标签和body标签

代码格式:
父子关系:子级标签换行且缩进(Tab键)
兄弟关系:兄弟标签换行且对齐


注释

<!--...-->注释标签用来在源文档中插入注释,注释不会在浏览器中显示。

在Vs Code中,添加/删除注释的快捷键:Ctrl + /


路径

路径:
路径指的是查找文件时,从起点到终点经历的路线
路径分类:
相对路径:从当前文件位置出发查找目标文件
绝对路径:从盘符出发查找目标文件

相对路径:
. 当前文件所在文件夹
.. 当前文件上一级文件夹
/ 进入某个文件夹里面
绝对路径:
Windows默认是\(也能用/),其他系统是/,建议同意写为/
文件的在线网址:https://www.itheima.com/images/logo.png
绝对路径的应用场景:友情链接(跳转别的友商网站或自己的网站)

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

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

相关文章

生产系统稳定上线600天!中国联通CUDB for OceanBase的开源共建和规模化应用

中国联通软件研究院架构部平台承载了上千应用的数据库需求&#xff0c;并且现存大量数据库使用过程缺少规范、缺少监控&#xff0c;同时还存在着数据库核心技术相关风险。为了实现核心技术自主可控&#xff0c;及时为用户解决线上问题、满足用户的功能需求&#xff0c;提供物美…

gnu工程的编译 - 以libiconv为例

文章目录 gnu工程的编译 - 以libiconv为例概述gnu官方源码包的发布版从官方的代码库直接迁出的git版源码如果安装了360, 需要添加开发相关的目录到信任区生成 configrue 的方法备注END gnu工程的编译 - 以libiconv为例 概述 gnu工程的下载分2种: gnu官方源码包的发布版 这种…

gitee+picgo+typora图床搭建

giteepicgotypora图床搭建 1.安装typora 官网下载直接安装&#xff1a;https://www.typora.io/#download 2.编辑typora图像设置 打开 文件 -> 偏好设置 -> 图像设置 插入图片时 选择 上传图片设置 上传服务 为 PicGo-Core(command line) 3.为typora安装PicGo-Core 点…

达梦dm.ini参数之SELECT_LOCK_MODE详解

一、背景 1.现象概述 某项目当晚分区表变更&#xff0c;因为manager工具多开了1个窗口执行了语句慢取消了&#xff0c;新开了一个会话窗口执行添加分区/删除分区/truncate分区卡死了&#xff0c;v$session查不到关于这张分区表的阻塞和事务&#xff0c;但是在v$lock里根据表的…

Golang 通用代码生成器仙童发布 2.4.0 电音仙女尝鲜版二,改进三大部分生成功能群

Golang 通用代码生成器仙童发布 2.4.0 电音仙女尝鲜版二&#xff0c;改进三大部分生成功能群 Golang 通用代码生成器仙童已发布 2.4.0 电音仙女尝鲜版二及其介绍视频。尝鲜版二改进了三大部分生成功能群。 视频请见&#xff1a; https://www.bilibili.com/video/BV1Q64y1H75…

CH07_简单化

Facade 模式 外观模式&#xff08;Facade&#xff09;&#xff0c;为子系统中的一组接口提供一个一致的界面&#xff0c;此模式定义了一个高层接口&#xff0c;这个接口使得这一个系统更加容易使用。 类图 说明 Facade&#xff08;窗口&#xff09; Facade角色是代表构成系统…

【用unity实现100个游戏之19】制作一个3D传送门游戏,实现类似鬼打墙,迷宫,镜子,任意门效果

最终效果 文章目录 最终效果素材第一人称人物移动开门效果显示原理渲染相机跟着我们视角移动门的摄像机跟着我们旋转近裁剪面设置传送配置代码实现传送效果结束完结素材 https://assetstore.unity.com/packages/3d/props/interior/door-free-pack-aferar-148411

andriod安卓水果商城系统课设

​ 一、目的及任务要求 随着当今社会经济的快速发展和网络的迅速普及&#xff0c;手机基本成为了每个人都随身携带的电子产品。传统的购物方式已经满足不了现代人日益追求便利及高效率的购物心理&#xff0c;而通过移动手机上的在线购物系统&#xff0c;可以便捷地甚至足不出…

XV7011BB陀螺传感仪的规格书

角速率输出(16/24bit)优异的温度偏置稳定性工作温度范围-20℃至80℃(可选:-40℃至85℃) 角速率输出(16/24bit)优异的温度偏置稳定性工作温度范围-20℃至80℃(可选:-40℃至85℃)内置温度传感器内置可选数字滤波器低功耗视频:XV7000系列&#xff0c;用于…

全面解析 I2C 通信协议

全面解析 I2C 通信协议 lvy 嵌入式学习规划 2023-12-22 21:20 发表于陕西 嵌入式学习规划 嵌入式软件、C语言、ARM、Linux、内核、驱动、操作系统 80篇原创内容 公众号 点击左上方蓝色“嵌入式学习规划”&#xff0c;选择“设为星标” 1、什么是I2C协议 I2C 协议是一个允许…

【2023年12月18日-12月25日】一周AI咨询更新

上周&#xff0c;关于Google的Bard和Midjourney v6的讨论异常火热。 接下来&#xff0c;让我们回顾一下上周那些引人注目的AI新闻。 ① 已近乎真实拍摄&#xff1a;Midjourney v6的画质令人惊叹 由Midjourney v6制作的图片&#xff0c;质量之高&#xff0c;媲美电影级别&…

关于使用Selenium获取网页控制台的数据

背景&#xff1a; 需要获取网页的控制台的数据&#xff0c;如下图 在此文章将使用到 Pycharm 和 Selenium4 Pycharm安装 Selenium安装 from selenium import webdriver from selenium.webdriver.common.by import By import time# 创建浏览器对象 browser webdriver.Chro…

【Recruitment Mercedes Benz】

Network I) JDII) IPv4与IPv6之间的区别是什么III) was advices3.1&#xff09; 防火墙&#xff0c;配置&#xff0c;数据的in/out (data flow in or flow out)3.2&#xff09; 域名&#xff0c;网址&#xff0c;端口3.3) 三次握手&#xff0c;四次挥手3.4) TCP/IP, 几层协议&a…

Ubuntu 22.04 安装ftp实现与windows文件互传

Ubuntu 22.04 安装ftp实现与windows文件互传 1、配置安装 安装&#xff1a; sudo apt install vsftpd -y使能开机自启&#xff1a; sudo systemctl enable vsftpd 启动&#xff1a; sudo systemctl start vsftpd创建ftp工作目录&#xff1a; sudo mkdir -p /home/ftp/uftp…

PHP的Laravel的数据库迁移

1.默认迁移文件 2.数据库迁移 在终端输入以下代码 php artisan migrate 我的报错啦&#xff01;&#xff01;&#xff01;&#xff01;&#xff01; 数据库里面只有两张表&#xff0c;实际上应该有四张的&#xff01;&#xff01;&#xff01; 解决方法&#xff1a; 反正表已…

企业如何正确的云迁移,云迁移过程中需要注意哪几个点?

如今的企业比以往任何时候都能访问更多的数据。这些数据正在以惊人的速度增长&#xff0c;无论是数量还是变化量。无论是传统的分析还是机器学习和人工智能等前沿技术&#xff0c;将这些信息从所有信息源集中到云存储库对业务至关重要。 为什么进行迁移&#xff1f; 企业将数…

项目接口性能优化方案

&#x1f9d1;‍&#x1f4bb;作者名称&#xff1a;DaenCode &#x1f3a4;作者简介&#xff1a;CSDN实力新星&#xff0c;后端开发两年经验&#xff0c;曾担任甲方技术代表。会点点Java相关技术栈、帆软报表、低代码平台快速开发。技术尚浅&#xff0c;闭关学习中 &#x1f60…

模拟算法 蓝桥杯备赛系列 acwing

文章目录&#xff1a; 基础知识 什么是模拟&#xff1f; 例题 一、错误票据 1.解题思路 2.代码 二、移动距离 1.解题思路 2.代码 三、航班时间 1.解题思路 2.代码 四、外卖优先级 1.解题思路 2.代码 前面为了目录好看大家就当个玩笑看吧哈哈哈。下面上正文。 正文 基础知识 什…

LeetCode刷题---合并区间

解题思路&#xff1a; 一次遍历&#xff0c;首先按照每个元素区间的start来排序&#xff0c;之后定义一个列表将第一个元素添加进去&#xff0c;依次遍历数组的每个元素&#xff0c;如果第二个元素区间的start小于或者等于第一个元素区间的end&#xff0c;则证明两个区间是重叠…

第27关 在K8s集群上使用Helm3部署最新版本v2.10.0的私有镜像仓库Harbor

------> 课程视频同步分享在今日头条和B站 大家好&#xff0c;我是博哥爱运维。 在前面的几十关里面&#xff0c;博哥在k8s上部署服务一直都是用的docker hub上的公有镜像&#xff0c;对于企业服务来说&#xff0c;有些我们是不想把服务镜像放在公网上面的&#xff1b; 同时…