Java Web 01_HTML4HTML5基础标签语法

HMTL基础

1.什么是HTML

Hyper Text Markup Language (超文本标记语言)标记又俗称标签(tag),一般格式:

<tagName></tagName><h1></h1>

标签里还可以有属性(Attribute):

<tagName Atrribute = “value” /><meta charset="utf-8" />

还有一些特殊非成对出现标签:

<hr />  <br />

HTML是由浏览器解析执行文档的基本结构

  • <! DOCTYPE html> —引用的HTML5规范
<html><head>            --头部:包含标签title、meta<meta charset=”utf-8” /><title></title>
</head><body>         ---主体</body>
</html>
  • meta
<meta charset=”utf-8” />

2.常用的编码格式

gbk : 中文简体
gb2312: 中文简体
utf-8: 国际默认编码字符
ios-8859-1: 西欧编码
big5: 大五码,繁体中文。应用:台湾地区

keywords 、 description 提供给搜索引擎

3.文本排版的常用标签

h1~h6 : 标题标签
p: 段落标签
hr: 水平线
br: 换行
strong: 字体加粗标签
em: 斜体
span: 无任何特殊样式的标签
pre: 预留格式标签
注释

<!-- 注释的内容 -->

4.特殊符号

  空格
> 大于符号
< 小于符号
" 双引号
© 版权符号

5.图像标签

<img src=”图片地址”alt=”图片加载失败后的提示”title=”鼠标悬停至图片上的提示”width=”宽度”height=”高度”
/>
  • 加载图像地址的两种方式:
1、	相对路径:<img src=”img/one.png或者../img/one.png”/>
2、	绝对路径:<img src=”https://www.baidu.com/one.png”>

7.超级链接

<a href=”链接地址” target=”目标窗口”>图像|文本 </a>

目标窗口:
_self: 当前窗口打开,默认
_blank: 新的窗口中打开
如果页面在使用frameset / frame / iframe的场景下才使用如下:
_parent: 在父级窗口中打开
_top: 在顶级窗口中打开
_自定义名称:在指定的特定窗口中打开
三种用法:

页面链接
<a href=”example03.html”>图片|文本</a>
锚链接:
<a href=”#help”></a>
这里的help可以是锚标记的name也可以id
功能链接:唤醒本地安装的某个外部程序
<a href=”emailto:3424324@qq.com”>图片|文本</a>

8.div标签

div是一个容器,常用与页面的布局

标签的分类

1.块级元素/块级标签:

如:div | p | hr | h1~h6
特性:独占一行,宽度没有设置的情况下由父容器100%决定

2.行级元素/行级标签:

如:span | strong | em | 
特性:多个行级元素可以同属一行,其宽度由内容决定,行级元素大部分设置宽高无效,除img。

3.无序列表

适用于呈现一些逻辑上有相关性的数据

<ul><li></li>
<ul>
ul里设置type属性定义标签
disc: 实心圆点
circle: 空心的圆圈
square:  实心的正方形

4.有序列表

适用于呈现一些逻辑上有相关性且有顺序的数据

<ol><li></li>
</ol>
  • 设置type属性的类型
    1: 阿拉伯数字
    a: 小写字母
    A: 大写字母
    i: 小写罗马数字
    I: 大写的罗马数字

  • 定义列表
    适用于有主题描述的信息

<dl><dt>主题</dt><dd>描述</dd>
</dl>

注意:
有序列表与无序列表可以嵌套使用,ul的下级是li,li上级是ul。

9.表格标签–重点

<table><! --- 表头 -->
<thead><tr><th></th>
</tr>
</thead><! --- 主体 -->
<tbody><tr><td></td></tr>
………
</tbody><! --- 表脚 -->
<tfoot>
<tr><td></td>
</tr>
</tfoot>
</table>

table: 表格
thead: 表头
tbody: 主体
tfoot: 表脚
tr: 行
td: 单元格
th: 单元格(一般是用于表头信息,文本信息默认加粗居中)

表格属性

width: 宽度
height: 高度
border: 边框
borderColor: 边框颜色
cellpadding: 表格填充(内)
cellspacing: 表格的间距(外)
align: 水平方向

单元格属性

align: 水平方向 left center right
valign: 垂直方向 top middle bottom
合并单元格(colspan: 跨列| rowspan: 跨行)

注意:在合并后,相应单元格的行和列的数量要发生改变。

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

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

相关文章

C++ STL vector容器详解

vector 容器是 STL 中最常用的容器之一&#xff0c;它和 array 容器非常类似&#xff0c;都可以看做是对 C 普通数组的“升级版”。不同之处在于&#xff0c;array 实现的是静态数组&#xff08;容量固定的数组&#xff09;&#xff0c;而 vector 实现的是一个动态数组&#xf…

Debezium日常分享系列之:Debezium 2.5.0.CR1发布

Debezium日常分享系列之&#xff1a;Debezium 2.5.0.CR1发布 一、重大变化1.Cloud Event 标头的架构名称2.MySQL BIT 默认长度 二、新功能和改进1.重新选择列2.Debezium Server - 用于 Apache Kafka 接收器的 StreamNameMapper3.增量快照水印的 INSERT/DELETE 语义4.Debezium 服…

1.7 实战:Postman请求Post接口-登录

上一小节我们实战了使用Postman请求Get接口。本小节我们来使用Postman请求Post接口。 我们来测试一下登录,之前已经创建好了Collections。我们选择登录页下的登录这个请求。地址也是跟之前一样,我们打开校园二手交易系统,打开浏览器开发者工具,输入用户名和密码,点击登录…

力扣22. 括号生成(java 回溯法)

Problem: 22. 括号生成 文章目录 题目描述思路解题方法复杂度Code 题目描述 思路 我们首先要知道&#xff0c;若想生成正确的括号我们需要让右括号去适配左括号&#xff0c;在此基础上我们利用回溯去解决此题目 1.题目给定n个括号&#xff0c;即当回溯决策路径长度等于 2 n 2n…

网络基础2

三层交换机&#xff1a;路由器交换机 创建vlan 配置0/0/2串口为vlan2&#xff0c;3接口为vlan3 三层交换机的串口是不能直接配置地址&#xff0c;要在虚拟接口&#xff08;vlan的接口&#xff09;配置IP地址 配置vlan1的虚拟接口 此时vlan1的主机能ping通三层交换机串口1的地址…

西南交通大学【数电实验7---按键防抖动设计】

实验电路图、状态图、程序代码、仿真代码、仿真波形图&#xff08;可以只写出核心功能代码&#xff0c;代码要有注释&#xff09; 一共四个状态&#xff1a;1.未按下时空闲状态 2.按下抖动滤除状态 3.按下稳定状态 4.释放抖动滤除状态 在第一个状态时&#xff0c;等待按键按下&…

【jitterbuffer】3:VCMJitterEstimator及所需的概率知识:期望、方差、协方差

期望 : 全国的平均积雪深度 期望值为负 概率就是 不同国家的面积了,总面积是1 期望计算公式 某种函数的期望 K的求和范围 计算期望 1

Peter算法小课堂—简单建模(1)

简单建模是什么&#xff1f;建模模拟数据结构。 太戈编程2601题 题目描述&#xff1a; 你经过多年学习&#xff0c;获得了博士学位&#xff0c;一共发表了n篇论文&#xff0c;并且你的第 i 篇论文得到了来自其他研究文献的 ci 次引用。在学术圈里&#xff0c;通常会使用 H 指数…

Java常用API合集(一)

文章目录 一、StringBuilder类1.1 方法演示1.2 String 和StringBuilder互转1.3 String 和StringBuilder效率对比1.4 应用案例 二、StringJoiner类三、Math类四、System类五、Runtime类 一、StringBuilder类 StringBuilder代表可变字符串对象&#xff0c;相当于是一个容器&…

dcf写入机制

dcf写入机制 写入 dcf提供如下两个写入接口&#xff1a; dcf_write int dcf_write(unsigned int stream_id, const char* buffer, unsigned int length, unsigned long long key, unsigned long long *index);仅在leader节点调用。 dcf_universal_write int dcf_universal_w…

代码审计的未来趋势

代码审计的未来发展趋势&#xff0c;如人工智能、区块链、云计算等代码审计是一项非常重要的工作&#xff0c;可以帮助团队发现潜在的安全漏洞和缺陷。随着技术的不断发展&#xff0c;代码审计也在不断地发展和改进。本文将介绍代码审计的未来发展趋势&#xff0c;包括人工智能…

C++ 标准库-chrono 基本用法

文章目录 再C开发中&#xff0c;经常会遇到时间相关的问题&#xff0c;这里可以借助 <chrono>来帮我们解决问题。 <chrono> 是 C 标准库中的一个头文件&#xff0c;它提供了处理时间和日期的功能。这个库引入了一组类型和函数&#xff0c;用于在程序中进行时间点、…

Linux(22):X Window 设定介绍

X Window System X Window System 是个非常大的架构&#xff0c;他还用到网络功能。也就是说&#xff0c;其实 X 窗口系统是能够跨网络与跨操作系统平台的。 X Window系统最早是由 MIT (Massachusetts Institute of Technology&#xff0c;麻省理工学院) 在1984年发展出来的&…

day13 栈与队列(三)

day13 2023.12.11 代码随想录 今天刚出差回来&#xff0c;拉下了很多天的博客&#xff0c;慢慢补吧&#xff0c;每天做当天的任务&#xff0c;再补一篇博客。 1. 239滑动窗口最大值 本题就是每次窗口内容放在一个单调队列中&#xff0c;那么每次直接返回队头元素&#xff08;最…

register_chrdev函数使用

static struct class *led_class;static int major 0; /*记得static 不然可能会出现外部.c调用这个变量的可能*/static struct file_operations led_drv {.owner THIS_MODULE,.open led_drv_open,.read led_drv_read,.write led_drv_write,.release led_drv…

Python中的继承:概念、用法与示例

目录 一、引言 二、继承的概念 三、继承的用法 1、继承父类的属性和方法 2、添加新的属性和方法 3、覆盖父类的方法 四、示例代码展示 五、继承中的多态性 六、继承中的封装和抽象 七、继承中的多重继承 总结 一、引言 面向对象编程&#xff08;OOP&#xff09;是一…

「完美世界」石昊被诓入至尊道场,修炼无敌道,打跑天仙书院弟子

Hello,小伙伴们&#xff0c;我是拾荒君。 《完美世界》这部国漫&#xff0c;在粉丝的翘首期盼中&#xff0c;终于迎来了第141集的更新。这一集的内容&#xff0c;对于喜欢石昊和至尊道场劫难的观众来说&#xff0c;可谓是扣人心弦&#xff0c;让人目不转睛。 在这一集中&#…

【信息学奥赛】拼在起跑线上,想入道就别落下自己!

编程无难事&#xff0c;只怕有心人&#xff0c;学就是了&#xff01; 文章目录 1 信息学奥赛简介2 信息学竞赛的经验回顾3 优秀参考图书推荐《信息学奥赛一本通关》4 高质量技术圈开放 1 信息学奥赛简介 信息学奥赛&#xff0c;作为全国中学生学科奥林匹克“五大学科竞赛”之一…

ChatGPT使用:一个发包机器人的提示词

发包机器人&#xff1a; 设想&#xff1a;目前项目组有n条打包线会输出多个包&#xff0c;用户想获取最新的包是比较困难的&#xff0c;难点在于 1. 分支多&#xff1a;trunk&#xff0c;release&#xff0c;outer等&#xff0c;至少有3个分支&#xff1b; 2. 多平台&#x…

C++ 面向对象模型 小知识点

空类 大小 空类的 sizeof 结果是 1。原因&#xff1a;每个对象都应该在内存上有独一无二的地址&#xff0c;因此给空对象分配 1 个字节空间。 当定义了一个变量后&#xff0c;则类的大小为这个变量的大小。 类中 变量和函数是分开存储的。 静态成员变量&#xff0c;静态成员函数…