HTML简单了解和基础知识记录

参考视频

html的用途

超文本标记语言(英语:HyperText Markup Language,简称:HTML),用来显示网页的文字和框架结构,可以认为是网页的骨架。

标签/元素

用于定义文字图片连接等,分为双标签和单标签。
双标签格式:<标签名字> 标签修饰的内容 </标签名字>;例如

<p>这是一个段落</p>
<h1>这是一个一级标题</h1>

单标签:<标签名字 [内容]>,有些有内容有些没有

<input type="text">  //一个输入
<br> //换行
<br> //一条分割横线

主要写的内容是标签内的内容

常用的小知识

//都是双标签,修改段落P中字体的标签
字体加粗:b ;斜体:i; 下划线:u; 删除线:s//列表标签
无序列表ul;其中包含多个列表标签li
有序列表ol:其中包含多个列表标签li//表格标签
表格table,
属性,border(表格边框线宽度赋值一个字符形式)
第一行标签th //table header
行标签tr //table row
列标签 td   //table data//a标签和img标签都不会自动换行!!
//把标签包含的内容,连接到其他路径
连接标签 a
href属性,定义连接url,当是  #  时表示不跳转
target属性,打开连接的方式,在新窗口或本页等打开//图片标签
图片标签img
属性src,路径或图片链接
alt ,用于图片替换文本,图片无法显示的时候
with,图片宽度
height,图片高度//分割块
div 并无意义就是为了分开整体结构布局//没有特殊元素的标签
span,不独占一行,为了把文本内容包装起来,方便css和js修改//表单标签
form标签
label双标签,标识inputfor属性,后面跟id名字,为了作用那个id
包含input标签,单标签,type属性,text,password(非明文显示)等;placeholder属性,默认显示的内容提示value属性,实际填充值radio属性,勾选name属性,是gender时,表示radio单选
action属性表单向那个ufl提交,使用#表示只是占位不跳转

标签的属性

语法规则

<标签名字 属性名称='属性值'> ,,,</标签名字> //属性值使用英文的单引号或双引号都行

属性名称不区分大小写,但属性值区分大小写,适用于大部分html属性,下面的属性配合CSS批量修改标签形式

在这里插入图片描述

块元素和行内元素

就是标签是不是独占一行,下个标签自动换行行内元素不能包含块元素
常见块标签(独占一行):div,p,h1,ul ,table,form等
常见的a,img strong等

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

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

相关文章

前端 uniapp 多端条件编译

条件编译是用特殊的注释作为标记&#xff0c;在编译时根据这些特殊的注释&#xff0c;将注释里面的代码编译到不同平台。 使用方法 以 #ifdef 或 #ifndef 加 %PLATFORM% 开头&#xff0c;以 #ifndef 结尾。 #ifdef&#xff1a;if defined 仅在某平台存在#ifndef&#xff1a;…

MacOS上升级Ruby版本

在MacOS上升级Ruby版本是一个涉及多个步骤的过程&#xff0c;这些步骤不仅要求技术操作准确&#xff0c;还需要考虑到与项目兼容性、依赖包管理以及系统安全性等多方面的因素。以下将详细介绍MacOS上升级Ruby版本的流程、注意事项以及可能的解决方案&#xff0c;确保整个升级过…

R 语言学习教程,从入门到精通,R 绘图饼图(23)

1、R 绘图 条形图 条形图&#xff0c;也称为柱状图条形图&#xff0c;是一种以长方形的长度为变量的统计图表。 条形图可以是水平或垂直的&#xff0c;每个长方形可以有不同的颜色。 R 语言使用 barplot() 函数来创建条形图&#xff0c;格式如下&#xff1a; barplot(H,xlab,…

JavaScript初级——DOM和事件简介

一、什么是DOM&#xff1f; 二、模型 三、对象的 HTML DOM 树 四、节点 浏览器已经为我们提供了文档节点对象&#xff0c;这个对象是window属性&#xff0c;可以再网页中直接使用&#xff0c;文档节点代表的是整个网页。 五、事件简介 事件&#xff0c;就是用户和浏览器之间的交…

最短路 - BellFord算法

有边数限制&#xff0c;存在负权边 题目描述 给定一个n个点m条边的有向图&#xff0c;图中可能存在重边和自环&#xff0c;边权可能为负数。 请你求出从1号点到n号点的最多经过k条边的最短距离&#xff0c;如果无法从1号点走到n号点&#xff0c;输出impossible. 注意:图中可能…

vue3+vite+cesium配置参考

在vite项目中使用Cesium的配置 关键&#xff1a; 资源目录的复制&#xff1b;CESIUM_BASE_URL的正确配置 //vite.config.js // ... // 安装打包复制资源插件&#xff0c;手动复制不需要 // npm i vite-plugin-static-copy import { viteStaticCopy } from vite-plugin-static-c…

linux+mysql+mongo+redis基础指令一文秒懂

Linux基础指令 基础指令&#xff1a; 安装网络工具&#xff0c;终端输入&#xff1a;sudo apt install net-tools&#xff0c;可以输入ifconfig查看虚拟机Ip 2. 适配客户机分配率&#xff0c;终端输入&#xff1a;sudo apt install open-vm-tools 3. 指令格式&#xff1a;指令名…

Linux系统下的容器安全:深入解析与最佳实践

在云计算和微服务架构的推动下&#xff0c;容器技术因其高效、可移植和灵活的特点&#xff0c;已经成为现代软件开发和部署的首选方案。然而&#xff0c;容器的广泛应用也带来了新的安全挑战&#xff0c;尤其是在Linux系统下&#xff0c;容器安全的实现和维护变得尤为重要。本文…

Ruby跨平台移动应用开发的新篇章

标题&#xff1a;Ruby跨平台移动应用开发的新篇章 在移动应用开发领域&#xff0c;Ruby作为一种高效灵活的编程语言&#xff0c;通过一系列框架和工具&#xff0c;成功地拓展了其应用边界。本文将详细介绍Ruby在移动应用开发中的应用&#xff0c;特别是跨平台解决方案&#xf…

C++ 设计模式——单例模式

单例模式 C 设计模式——单例模式1. 单例模式的基本概念与实现2. 多线程环境中的问题3. 内存管理问题1. 内存泄漏风险2. 自动释放策略3. 垃圾回收机制4. 嵌套类与内存管理 4. UML 图UML 图解析 优缺点适用场景总结 C 设计模式——单例模式 单例模式&#xff08;Singleton Patt…

【Redis】渐进式遍历和数据库管理

渐进式遍历和数据库管理 渐进式遍历scan 数据库管理切换数据库清除数据库 渐进式遍历 Redis 使⽤ scan 命令进⾏渐进式遍历键&#xff0c;进⽽解决直接使⽤ keys 获取键时可能出现的阻塞问题。每次 scan 命令的时间复杂度是 O(1)&#xff0c;但是要完整地完成所有键的遍历&…

360发布FancyVideo:通过跨帧文本指导实现动态且一致的视频生成SOTA!

文章链接&#xff1a;https://arxiv.org/pdf/2408.08189 项目链接&#xff1a;https://360cvgroup.github.io/FancyVideo/ 亮点直击 本文介绍了FancyVideo&#xff0c;据众所知的首个探索T2V任务中跨帧文本指导的开创性尝试。该方法为增强当前的文本控制方法提供了新的视角。 …

EmguCV学习笔记 VB.Net 6.5 凸包和凸缺陷

版权声明&#xff1a;本文为博主原创文章&#xff0c;转载请在显著位置标明本文出处以及作者网名&#xff0c;未经作者允许不得用于商业目的。 EmguCV是一个基于OpenCV的开源免费的跨平台计算机视觉库,它向C#和VB.NET开发者提供了OpenCV库的大部分功能。 教程VB.net版本请访问…

git远程仓库关联切换迁移

上一篇有关git基础设置文章地址&#xff1a; https://blog.csdn.net/lareinax5/article/details/124271339 关于两个仓库迁移&#xff0c;使用&#xff1a; 一、本地仓库文件关联远程仓库 1.先进入你要上传的文件夹&#xff1a; cd /path/to/your/folder2.初始化仓库、查看…

组合的输出-深度优先搜索

组合的输出 https://www.luogu.com.cn/problem/P1157 #include<bits/stdc.h> using namespace std; int n,r; bool v[50]; int f[50]; //now 用哪个数填 l填第几个空 void dfs(int now,int pos){ if(posr1){//r个空填满 for(int i1;i<r;i){ printf(“%3d”,f[i]); } …

OpenCV c++ 实现图像马赛克效果

VS2022配置OpenCV环境 关于OpenCV在VS2022上配置的教程可以参考&#xff1a;VS2022 配置OpenCV开发环境详细教程 图像马赛克 图像马赛克&#xff08;Image Mosaic&#xff09;的原理基于将图像的特定区域替换为像素块&#xff0c;这些像素块可以是纯色或者平均色&#xff0c…

SpringMVC核心机制环境搭建

文章目录 1.SpringMVC执行流程1.基础流程图2.详细流程图 2.安装Tomcat1.下载2.解压到任意目录即可3.IDEA配置Tomcat1.配置Deloyment2.配置Server 3.创建maven项目1.创建sun-springmvc模块&#xff08;webapp&#xff09;2.查看是否被父模块管理3.pom.xml引入依赖4.目录5.SunDis…

【Redis】Redis数据结构——Hash 哈希

哈希 命令hsethgethexistshdelhkeyshvalshgetallhmgethlenhsetnxhincrbyhincrbyfloat命令小结 内部编码使用场景缓存⽅式对⽐ ⼏乎所有的主流编程语⾔都提供了哈希&#xff08;hash&#xff09;类型&#xff0c;它们的叫法可能是哈希、字典、关联数组、映射。在 Redis 中&#…

一拖二快充线市场需求 - LDR6020

一拖二快充线市场需求与LDR6020应用快充线市场推广 随着科技的飞速发展&#xff0c;智能设备已成为我们日常生活中不可或缺的一部分。从智能手机到平板电脑&#xff0c;再到笔记本电脑&#xff0c;这些设备极大地丰富了我们的生活方式&#xff0c;但同时也带来了一个普遍的问题…

C语言函数介绍(上)

函数概念库函数标准库和头文件库函数的使用方法头文件包含库函数文档的一般格式 自定义函数函数的语法形式函数例子 形参和实参实参形参实参和形参的关系 return 语句数组做函数参数 函数概念 数学中我们其实就见过函数的概念&#xff0c;比如&#xff1a;一次函数 ykxb &…