当前位置: 首页 > news >正文

【HTML语法】

HTML语法

  • 1. HTML语法
    • 1.1 HTML编辑器
    • 1.2 HTML模板
    • 1.3 标签示例
    • 1.4 常见的HTML标签
    • 1.5
    • 1.6
    • 1.7
    • 1.8
    • 1.9
    • 1.10
    • 1.11

学习网站:https://www.runoob.com/html/html-tutorial.html

1. HTML语法

HTML(全称 Hypertext Markup Language,超文本标记语言)是一种用于创建网页的标记语言
它包括一系列的标签和属性,用于定义和描述网页的内容和结构。
HTML语言是用来告知浏览器如何组织页面的标记语言。
HTML不是一门编程语言,而是一种定义内容结构的语言。
HTML元素可以使不同的元素内容呈现出不同的网页显示效果。
HTML 文件通常由一个头部(head)和一个主体(body)组成。
头部包含一些元数据,例如页面标题、关键词、作者、字符集等等。
主体则包含网页的实际内容,例如文字、图像、视频、链接等等。
HTML 是构建现代网页的基础,常常与 CSS 和 JavaScript 一起使用,以实现更丰富、更动态的网页效果。

CSS 是层叠样式表(Cascading Style Sheets)的缩写,是一种用于网页设计的样式表语言。
CSS 用于描述网页的样式和布局,例如文本颜色、字体、大小、行距、背景颜色、边框、位置等等。
CSS 将样式和结构分离开来,这意味着您可以在不更改 HTML 代码的情况下更改页面的样式和布局。
CSS 可以使网站更加易于维护和更改,同时还能提高页面的加载速度和性能。
CSS 有许多功能和特性,包括选择器、盒模型、布局、动画、转换、媒体查询等等。
学习 CSS 可以使您创建出漂亮、现代和响应式的网页设计。

JavaScript可以使用一个运行时环境 Node.js进行服务器端编程。
Node.js允许开发人员在服务器端运行JavaScript代码,并提供访问各种模块和库以构建Web应用程序,处理网络请求和与数据库交互等功能。
使用Node.js,您可以使用流行的Web框架(例如Express、Koa和Hapi)构建服务器端Web应用程序,并且还可以使用库(例如Mongoose、Sequelize和pg)与数据库(如MongoDB、MySQL和PostgreSQL)进行交互。
Node.js提供了事件驱动的、非阻塞的I/O模型,这使得它非常适合构建可扩展和高性能的Web应用程序。它也是跨平台的,这意味着您可以在Windows、Linux或macOS服务器上运行Node.js应用程序。
JavaScript是一种多用途的语言,可以用于客户端和服务器端编程,这得益于Node.js的普及。

1.1 HTML编辑器

  • W3Schools 在线HTML编辑器:这是一个免费的在线工具,允许您创建HTML模板并实时查看结果。
  • CodePen:这是一个供前端开发人员使用的社交开发环境。您可以创建HTML模板并与他人共享。
  • Bootstrap Studio:这是一个强大的桌面应用程序,允许您使用Bootstrap创建响应式网站。
  • Dreamweaver:这是Adobe的一个Web开发工具,允许您使用可视化界面创建HTML模板。
  • Sublime Text:这是一个流行的代码编辑器,支持HTML语法高亮和其他有用的Web开发功能。

1.2 HTML模板

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文档标题</title>
</head>
<body><h1>我的第一个HTML页面</h1><p>我的第一个段落。</p>
</body>
</html>

在这里插入图片描述

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>Simple HTML Template</title><!-- Add some style to the page --><style>body {background-color: lightblue;}h1 {color: white;text-align: center;}</style>
</head>
<body><h1>This is a simple HTML template</h1><p>Here's some text to fill the page.</p><!-- Add some functionality to the page with JavaScript --><script>// Create a variable to store the button elementvar button = document.createElement("button");// Set the text of the buttonbutton.innerHTML = "Click me";// Add an event listener to the buttonbutton.addEventListener("click", function() {alert("You clicked the button!");});// Append the button to the body of the pagedocument.body.appendChild(button);</script>
</body>
</html>

这只是一个简单的示例,但希望它能够让您了解 HTML、CSS 和 JavaScript 如何协同工作,创建动态和交互式的网页。

1.3 标签示例

<p>床前明月光,疑是地上霜。</p>

1.4 常见的HTML标签

在这插入图片描述
在这里插入图片描述

1.5

1.6

1.7

1.8

1.9

1.10

1.11

相关文章:

【HTML语法】

HTML语法 1. HTML语法1.1 HTML编辑器1.2 HTML模板1.3 标签示例1.4 常见的HTML标签1.51.61.71.81.91.101.11 学习网站&#xff1a;https://www.runoob.com/html/html-tutorial.html 1. HTML语法 HTML&#xff08;全称 Hypertext Markup Language&#xff0c;超文本标记语言&…...

ROS报错:RLException:Invalid roslaunch XML Syntax: mismatched tag:

运行roslaunch文件提示&#xff1a; RLException:Invalid roslaunch XML Syntax: mismatched tag: line 45&#xff0c; column 2 The traceback for the exception was written to the log file. j 解决办法&#xff1a; line45 行多了标签&#xff1a;</node> 另外…...

C语言实现快速排序

完整代码&#xff1a; #include<stdio.h>//用第一个元素将待排序序列划分成左右两个部分&#xff0c;返回排序后low的位置&#xff0c;即枢轴的位置 int partition(int arr[],int low,int high){//让待排序序列中的第一个元素成为基准int pivotarr[low];//lowhigh代表一…...

ChatGPT对于当今的社会或科技发展有何重要性?

ChatGPT对于当今社会和科技发展的重要性在于&#xff1a; 促进社交交流&#xff1a;ChatGPT可以为人们提供全天候的在线聊天服务&#xff0c;连接人与人之间的沟通交流&#xff0c;改善社交沟通方式。 提高有效性和效率&#xff1a;人们可以通过ChatGPT获得快速和精确的信息&a…...

宝塔是可以切换mongodb版本的

在软件商店&#xff0c;搜索monggodb&#xff0c;点击设置。点击第三个标签版本切换即可。但是前提要删除所有非系统数据库。 删除数据库方法&#xff1a; 要在 MongoDB 中删除一个数据库&#xff0c;可以使用 dropDatabase() 命令。请注意&#xff0c;在执行此操作之前&#x…...

16、XSS——会话管理

文章目录 一、web会话管理概述1.1 会话管理1.2 为什么需要会话管理&#xff1f;1.3 常见的web应用会话管理的方式 二、会话管理方式2.1 基于server端的session的管理方式2.2 cookie-based的管理方式2.3 token-based的管理方式 三、安全问题 一、web会话管理概述 1.1 会话管理 …...

稀疏矩阵的操作(数据结构实训)

题目&#xff1a; 标准输入输出 题目描述&#xff1a; 稀疏矩阵可以采用三元组存储。 输入&#xff1a; 输入包含若干个测试用例&#xff0c;每个测试用例的第一行为两个正整数m,n(1<m,n<100),表示矩阵的行数和列数,接下来m行&#xff0c;每行n个整数&#xff0c;表示稀疏…...

sqlite - sqlite3_exec - c++回调函数的处理

文章目录 sqlite - sqlite3_exec - c回调函数的处理概述笔记回调赋值实现用到的数据结构回调分发函数的实现具体的回调处理sqlite3_exe执行完后, 行集的具体处理END sqlite - sqlite3_exec - c回调函数的处理 概述 以前给客户写了个小程序, 处理sqlite执行sql时, 给定回调, 等…...

docker搭建logstash和使用方法

配置logstash 查询下载镜像【固定和elasticsearch一样的版本】 [roothao ~]# docker search logstash NAME DESCRIPTION STARS OFFICIAL AUTOMATED logstash …...

Memory-augmented Deep Autoencoder for Unsupervised Anomaly Detection 论文阅读

Memorizing Normality to Detect Anomaly: Memory-augmented Deep Autoencoder for Unsupervised Anomaly Detection 摘要1.介绍2.相关工作异常检测Memory networks 3. Memory-augmented Autoencoder3.1概述3.2. Encoder and Decoder3.3. Memory Module with Attention-based S…...

Mac端 DevEco Preview 窗口无法展示,提示文件中的node.dir错误

语雀知识库地址&#xff1a;语雀HarmonyOS知识库 飞书知识库地址&#xff1a;飞书HarmonyOS知识库 DevEco版本&#xff1a;Build Version: 3.1.0.501, built on June 20, 2023 环境信息 问题描述 打开 Preview 标签窗口后&#xff0c;提示Preview failed。 Run窗口提示如下 F…...

TIMO后台管理系统 Shiro 反序列化漏洞复现

0x01 产品简介 TIMO 后台管理系统,基于SpringBoot2.0 + Spring Data Jpa + Thymeleaf + Shiro 开发的后台管理系统,采用分模块的方式便于开发和维护,支持前后台模块分别部署,目前支持的功能有:权限管理、部门管理、字典管理、日志记录、文件上传、代码生成等,为快速开发后…...

3.4_1 java自制小工具 - pdf批量转图片

相关链接 目录参考文章&#xff1a;pdf转图片(apache pdfbox)参考文章&#xff1a;GUI界面-awt参考文章&#xff1a;jar包转exe(exe4j)参考文章&#xff1a;IDEA导入GIT项目参考文章&#xff1a;IDEA中使用Gitee管理代码gitee项目链接&#xff1a;pdf_2_image网盘地址&#xf…...

vue中实现数字+英文字母组合键盘

完整代码 <template><div class"login"><div click"setFileClick">欢迎使用员工自助终端</div><el-dialog title"初始化设置文件打印消耗品配置密码" :visible.sync"dialogSetFile" width"600px&quo…...

Centos服务器上根据端口号查询jar包,根据jar包查端口号

在开发springboot服务器时&#xff0c;经常会遇到其他人部署的java服务&#xff0c;需要自己维护&#xff0c;留下的信息又非常少。经常面临找不到jar包位置&#xff0c;或者不知道占用端口&#xff0c;不知道启动命令的问题。这里记录一下常用的centos服务器上的命令&#xff…...

数据仓库与数据挖掘复习资料

一、题型与考点[第一种] 1、解释基本概念(中英互译解释简单的含义)&#xff1b; 2、简答题(每个10分有两个一定要记住)&#xff1a; ① 考时间序列Time series(第六章)的基本概念含义解释作用&#xff08;序列模式挖掘的作用&#xff09;&#xff1b; ② 考聚类(第五章)重点考…...

限流算法,基于go的gRPC 实现的

目录 一、单机限流 1、令牌桶算法 3、固定窗口限流算法 4、滑动窗口 二、集群限流 1、分布式固定窗口 &#xff08;基于redis&#xff09; 2、分布式滑动窗口 一、单机限流 1、令牌桶算法 令牌桶算法是当流量进入系统前需要获取令牌&#xff0c;没有令牌那么就要进行限…...

Shell中HTTP变量和文本处理

在Shell中&#xff0c;HTTP变量和文本处理是常见的任务之一。Shell是一个命令行解释器&#xff0c;可以用来自动化执行各种系统任务。在Shell中&#xff0c;我们可以使用各种命令和工具来处理HTTP变量和文本。 首先&#xff0c;让我们来看看如何在Shell中处理HTTP变量。HTTP变…...

java学习part39map

159-集合框架-Map不同实现类的对比与HashMap中元素的特点_哔哩哔哩_bilibili 1.Map 2.Entry 个人理解是c的pair&#xff0c;代表一个键值对。Map就是entry的叠加 3.常用方法 4.TreeMap 5.Properties...

使用sqoop操作HDFS与MySQL之间的数据互传

一&#xff0c;数据从HDFS中导出至MySQL中 1&#xff09;开启Hadoop、mysql进程 start-all.sh/etc/init.d/mysqld start/etc/init.d/mysqld status 2&#xff09;将学生数据stu_data.csv传到HDFS的/local_student目录下 在hdfs中创建目录 hdfs dfs -mkdir /local_student 上…...

避坑指南:用conda管理TensorFlow环境时如何避免FailedPreconditionError日志目录冲突

避坑指南&#xff1a;用conda管理TensorFlow环境时如何避免FailedPreconditionError日志目录冲突 在深度学习项目开发中&#xff0c;TensorFlow作为主流框架之一&#xff0c;其环境配置的稳定性直接影响开发效率。许多开发者习惯使用conda进行Python环境管理&#xff0c;但在Te…...

猫抓浏览器扩展深度解析:现代网页资源嗅探的技术内幕与实践指南

猫抓浏览器扩展深度解析&#xff1a;现代网页资源嗅探的技术内幕与实践指南 【免费下载链接】cat-catch 猫抓 chrome资源嗅探扩展 项目地址: https://gitcode.com/GitHub_Trending/ca/cat-catch 在当今流媒体内容爆炸的时代&#xff0c;开发者和技术爱好者面临着一个共同…...

别再手动调参了!用Matlab+NRBO-BP+NSGAII搞定工艺优化,自动生成最优参数组合Excel

工艺优化新范式&#xff1a;基于NRBO-BP与NSGAII的智能参数寻优系统 在化工、材料、制造等领域的工艺优化过程中&#xff0c;工程师和研究人员常常面临一个共同的挑战&#xff1a;如何在有限的实验资源和时间约束下&#xff0c;从海量的参数组合中找到最优解。传统的手动调参方…...

原神抽卡数据分析终极指南:genshin-wish-export完全使用教程

原神抽卡数据分析终极指南&#xff1a;genshin-wish-export完全使用教程 【免费下载链接】genshin-wish-export biuuu/genshin-wish-export - 一个使用Electron制作的原神祈愿记录导出工具&#xff0c;它可以通过读取游戏日志或代理模式获取访问游戏祈愿记录API所需的authKey。…...

电子工程师的技术洁癖与嵌入式开发实践

1. 电子工程师的职业习惯与技术洁癖 1.1 工程师的强迫症表现 在电子工程领域&#xff0c;许多从业者都表现出典型的"技术洁癖"特征。这种职业习惯主要体现在以下几个方面&#xff1a; 元器件布局强迫症 &#xff1a;PCB板上电阻、电容等元件的焊盘必须对齐&#x…...

别再纠结了!手把手教你根据团队规模和技术栈选对存储方案(Ceph vs MinIO实战对比)

技术选型实战&#xff1a;Ceph与MinIO的团队适配决策框架 当技术负责人面对存储方案选型时&#xff0c;往往陷入"功能强大"与"简单易用"的两难抉择。我曾见证过一家50人规模的AI创业公司&#xff0c;因盲目选择Ceph导致三个月后不得不重构基础设施——他们…...

一、Cisco(静态端口映射实战:从零搭建外网可访问的多服务内网环境)

1. 环境准备与拓扑设计 第一次接触端口映射时&#xff0c;我也被那些专业术语搞得晕头转向。直到自己动手在Cisco Packet Tracer里搭了一套环境&#xff0c;才发现原来原理这么简单。这次我们就用最基础的设备&#xff0c;还原企业里常见的多服务发布场景。 实验设备清单就像搭…...

SpringBoot项目整合Redisson实战:从连接池报错到Redis集群健康检查的完整避坑指南

SpringBoot整合Redisson深度实践&#xff1a;连接池优化与集群健康监控全解析 Redis作为分布式系统的核心组件&#xff0c;其Java客户端Redisson的高阶用法一直是开发者关注的焦点。去年某电商平台大促期间&#xff0c;因Redis集群节点闪断导致的分布式锁失效事故&#xff0c;让…...

工业Python网关配置不是写代码,是做工程!揭秘ISO/IEC 62443合规配置清单(仅限首批200家制造企业内部流出)

第一章&#xff1a;工业Python网关配置不是写代码&#xff0c;是做工程&#xff01;在工业现场&#xff0c;Python网关绝非“跑个脚本就能连PLC”的玩具级工具——它是一套融合协议适配、资源约束、故障自愈与长期稳定运行的系统工程。配置的本质&#xff0c;是定义设备生命周期…...

Network Connection Class深度优化:10个提升网络检测精度的技巧

Network Connection Class深度优化&#xff1a;10个提升网络检测精度的技巧 【免费下载链接】network-connection-class Listen to current network traffic in the app and categorize the quality of the network. 项目地址: https://gitcode.com/gh_mirrors/ne/network-co…...