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

HTML之实体和标签

HTML之实体和标签

  • 实体
  • 标签
    • meta标签
    • 语义化标签
    • 列表
    • 超链接

实体

如果我们需要在网页中书写一些特殊符号,则需要在html中使用【实体】(转义符)
实体语法:
&实体的名字;

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>实体</title>
</head>
<body><!-- 在网页中编写的多个空格默认情况会自动被浏览器解析为一个空格在html中有时候不能直接写一些特殊符号,比如,多个连续的空格, 比如字母两侧的大于小于号如果我们需要在网页中书写一些特殊符号,则需要在html中使用【实体】(转义符)实体语法:&实体的名字;&nbsp; 空格&gt; 大于&lt; 小于&copy; 版权符号搜索使用w3school,或者zeal--><p>今天&nbsp;天气真不错!!</p>  <p>a < b > c <br/>a&gt;b&lt;c</p>
</body>
</html>

标签

meta标签

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><!-- mate主要用于设置网页中的一些元数据,元数据不是给用户看的charset 指定网页的字符集name 指定数据的名称content 指定的数据的内容keywords 表示网站的关键字,可以同时指定多个关键字,关键字间使用,(逗号)隔开<meta name="description"content="京东JD.COM-专业的综合网上购物商城,为您提供正品低价的购物选择、优质便捷的服务体验。商品来自全球数十万品牌商家,囊括家电、手机、电脑、服装、居家、母婴、美妆、个护、食品、生鲜等丰富品类,满足各种购物需求。"/><meta name="Keywords" content="网上购物,网上商城,家电,手机,电脑,服装,居家,母婴,美妆,个护,食品,生鲜,京东"/><meta name="keywords" content="网购,网上购物,在线购物,网购网站,网购商城,购物网站,网购中心,购物中心,卓越,亚马逊,卓越亚马逊,亚马逊中国,joyo,amazon">--><meta name="keywords" content="HTML,前端,CSS3"><meta name="description" content="这是一个非常棒的网站!"><!-- Redirect page after 3 seconds --><!-- <meta http-equiv="refresh" content="3;url=https://www.mozilla.org" /> 将网页重定向到另一个网站--><meta http-equiv="refresh" content="3;url=https://www.baidu.com"><title>meta标签</title>
</head>
<body>
</body>
</html>

语义化标签

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title>
</head>
<body><!-- 在网页中HTML专门负责网页的结构所以在使用html标签时,应该关注的是标签的语义,而不是它的样式,标题标签:从h1~h6一共有6级标题从h1~h6重要性递减,h1最重要,h6不重要从h1在网页中的重要性仅次于title标签,一般情况下页面中只会有一个h1一般情况下标题标签指挥使用到h1-h3,h4-h6很少用在页面中独占一行的元素称为块元素(block element)还有一种叫行内元素,不会独占一行--><!-- <h1>一级标题</h1> --><hgroup><h1>回乡偶书</h1><h2>其一</h2></hgroup><p>在p标签中的内容,就表示一个段落</p><p>在p标签中的内容,就表示一个段落</p><!-- em标签用于表示语音语调的加重在页面中不会独占一行的元素称为行内元素(inline element)--><p>今天天气<em></em>不错!!</p><!-- strong表示强调,重要内容! --><p>你今天必须要<strong>完成作业</strong></p>鲁迅说:<!-- blockquote表示长引用 --><blockquote>世界上本没有路,走的人多了变成了路。</blockquote><!-- q表示一个短引用 -->子曰:<q>学而时习之,不亦乐乎!</q>
</body>
</html>

列表

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title>
</head>
<body><!-- 列表:(list)1.铅笔2.尺子3.橡皮在html中也可以创建列表,html列表一共有三种:1.有序列表2.无序列表3.定义列表有序列表,使用ol标签来创建有序列表使用li表示列表项无序列表,使用ul标签来创建无序列表使用li表示列表项定义列表,使用dl标签来创建一个定义列表使用dt来表示定义的内容使用dd来对内容进行解释说明列表之间可以互相嵌套--><ul><li>结构</li><li>表现</li><li>行为</li></ul><ol><li>结构</li><li>表现</li><li>行为</li></ol><dl><dt>结构</dt><dt>结构表示网页的结构,结构用来规定网页中哪里是标题,哪里是段落</dt><dd>用来对内容进行解释说名<dd>dd嵌套一层,不起作用</dd></dd></dl><ul><li>数据</li><ul><li>列表</li><ul><li>第三个表</li></ul></ul></ul>
</body>
</html>

超链接

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>超链接</title>
</head>
<body><!-- 超链接可以让我们从一个页面跳转到其他页面或者当前页面的其他位置使用 a 标签来定义超链接属性:href 指定跳转的目标路径超链接也是一个行内元素,在a标签中可以嵌套任何的元素--><a href="https://www.baidu.com/">超链接</a><br><br><a href="">超链接</a>
</body>
</html>
http://www.lryc.cn/news/251155.html

相关文章:

  • 【小布_ORACLE笔记】Part11-1--RMAN Backups
  • 卷积神经网络-3D医疗影像识别
  • C++基础 -33- 单目运算符重载
  • [传智杯 #3 初赛] 课程报名
  • 华为OD机试 - 悄悄话(Java JS Python C)
  • LeetCode - 965. 单值二叉树(C语言,二叉树,配图)
  • 每日一题(LeetCode)----哈希表--三数之和
  • DL中的GPU使用问题
  • Linux命令——watch
  • 力扣题:字符的统计-12.2
  • Python----Pandas
  • 【UE】UEC++获取屏幕颜色GetPixelFromCursorPosition()
  • 数学建模-基于BL回归模型和决策树模型对早产危险因素的探究和预测
  • 接口测试 —— 接口测试的意义
  • 一些常见的爬虫库
  • 2023.12.2 做一个后台管理网页(左侧边栏实现手风琴和隐藏/出现效果)
  • 【EMFace】《EMface: Detecting Hard Faces by Exploring Receptive Field Pyramids》
  • 详细学习Pyqt5的20种输入控件(Input Widgets)
  • 【JavaEE初阶】Thread 类及常见方法、线程的状态
  • 0 NLP: 数据获取与EDA
  • 159.库存管理(TOPk问题!)
  • 【开源】基于Vue+SpringBoot的康复中心管理系统
  • 设计模式总览
  • 数据链路层之VLAN基本概念和基本原理
  • UVA11729 Commando War
  • 【数据库】数据库基于封锁机制的调度器,使冲突可串行化,保障事务和调度一致性
  • 大文件分片上传、分片进度以及整体进度、断点续传(一)
  • Pytest 的小例子
  • 大数据(十一):概率统计基础
  • web前端之TypeScript