HTML--基本结构构成

news2024/11/28 23:12:03

基本结构:

文档声明: <!DOCTYPE html>
htm标签对 :<html> </html>
head标签对: <head> </head>
body标签对:<body> </body>

如下结构:

<html>
<head> 
    <title>这是一个标题</title>
</head>
<body>
    <p>这是一个段落</p>
</body>
</html>

<head> </head> head标签对中一般只有6个标签能放进去
title标签: 定义网页标题,就是显示在网页标签栏的名字
meta标签:定义网页特殊信息,如关键字、页面描述等等。
style标签:定义元素的CSS样式
link标签:用于引入外部样式文件(CSS文件)
script标签:用于定义页面的JavaScript代码
base标签:没啥实际意义

>meta标签含以下两种属性,name和http-equiv

name属性:
	<!--这是一个注解-->
	<meta name="keywords" content="网页关键字,可以设定多个"/>
	<meta name="description" content="网页描述"/>
	<meta name="author" content="网页作者"/>
	<meta name="copyright" content="版权信息">
>http-equiv属性:定义网页编码,定义网页自动刷新跳转
	<!--定义网页使用的编码-->
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<!-- HTML5 可以用更简单的写法-->
	<meta charset="utf-8"/>
	
	<!--定义网页自动刷新跳转,6s后自动跳转到url指定的网页-->
	<meta http-equiv="refresh" content="6;url=http://www.xxx.com"/>
>style标签
	<style type="text/css">
		/*这里写css样式*/
	</style>
>script标签:
	<script>
		/*这里写JavaScript代码*/
	</script>
>link标签:
	<link type="text/css" rel="stylesheet" herf="css/index.css">

body标签:页面的身体,主要显示的一些数据,文字等等都在这个里面

<!DOCTYPE html>
<html>
<head> 
    <title>这是一个标题</title>
    <meta charset="utf-8"/>
</head>
<body>
    <h1>一级标签h1</h1>
    <h2>二级标签h2</h2>
    <h3>三级标签h3</h3>
    <h4>四级标签h4</h4>
    <h5>五级标签h5</h5>
    <!--这是一个注释-->
    <h6>六级标签h6</h6>
    <p>这是一个段落</p>
    <em>这是斜体字体</em>
</body>
</html>

效果图:
在这里插入图片描述

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

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

相关文章

修改iview的表格table展开的默认icon和样式

修改前 修改后 修改内容 .title_label_list .ivu-icon-ios-add{font-size: 26px;color: #888888; } .title_label_list .ivu-icon-ios-add:hover{color: #11AAAA; } .title_label_list .ivu-icon-ios-add:before {content: "\F341"; } .title_label_list .ivu-icon-…

JVM工作原理与实战(十八):运行时数据区-堆

专栏导航 JVM工作原理与实战 RabbitMQ入门指南 从零开始了解大数据 目录 专栏导航 前言 一、运行时数据区 二、堆 1.堆介绍 2.关键参数 总结 前言 ​JVM作为Java程序的运行环境&#xff0c;其负责解释和执行字节码&#xff0c;管理内存&#xff0c;确保安全&#xff0c…

Qt/QML编程之路:小键盘keyboard(36)

小键盘对于qml应用是经常用到的,在qml里面,就如一个fileDialog也要自己画一样,小键盘keyboard也是要自己画的,对于相应的每个按键的clicked都要一一实现的。 这里有一个示例: 代码如下: import QtQuick 2.5 import QtQuick.Controls 1.4 import QtQuick.Window 2.0 im…

【刷题】 leetcode 2 .两数相加

两数相加 两数相加1 思路一 &#xff08;暴毙版&#xff09;2 思路二 &#xff08;本质出发&#xff09; 谢谢阅读Thanks♪(&#xff65;ω&#xff65;)&#xff89;下一篇文章见&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01; 两数相加 我们来看…

DQN、Double DQN、Dueling DQN、Per DQN、NoisyDQN 学习笔记

文章目录 DQN (Deep Q-Network)说明伪代码应用范围 Double DQN说明伪代码应用范围 Dueling DQN实现原理应用范围伪代码 Per DQN (Prioritized Experience Replay DQN)应用范围伪代码 NoisyDQN伪代码应用范围 部分内容与图片摘自&#xff1a;JoyRL 、 EasyRL DQN (Deep Q-Networ…

Queue详解(Java)

Queue详解 Java 中的队列&#xff08;Queue&#xff09;是一种数据结构&#xff0c;它遵循先进先出&#xff08;FIFO&#xff09;的原则。队列可以用于在一个集合中保存一组元素&#xff0c;并支持在队列的尾部添加元素&#xff0c;以及在队列的头部移除元素。 Java 标准库提…

CleanMyMac X .4.14.7如何清理 Mac 系统?

细心的用户发现苹果Mac电脑越用越慢&#xff0c;其实这种情况是正常的&#xff0c;mac电脑用久了会产生很多的缓存文件&#xff0c;如果不及时清理会影响运行速度。Mac系统在使用过程中都会产生大量系统垃圾&#xff0c;如不需要的系统语言安装包&#xff0c;视频网站缓存文件&…

Spring全家桶

官网 Spring | Home 一、市面上主流的Spring框架以及简介 Spring Framework&#xff1a;Spring Framework是最基础、最核心的Spring框架&#xff0c;提供了IoC&#xff08;控制反转&#xff09;和AOP&#xff08;面向切面编程&#xff09;等功能。它是其他Spring项目的基础&am…

统计学-R语言-5.2

文章目录 前言大数定理中心极限定理和抽样分布抽样分布样本均值的分布样本比例的分布练习 前言 本篇文章将继续上篇的进行介绍。 大数定理 大数定理大数定理”的另一种表达方式是“均值定理”&#xff0c;其含义是&#xff0c;随机变量X多个观察值的均值会随着观察值的增加越…

探索 Python:发现有趣的库——第 1 章:数据可视化之旅

在一个充满活力的科技世界中&#xff0c;数据分析专家“算法仙”和编程爱好者“代码侠”相遇了&#xff0c;决定一起踏上数据可视化的探险之旅。他们将运用 Matplotlib 和 Seaborn 这两个强大的 Python 库&#xff0c;将枯燥的数据转化为生动的图形。 算法仙&#xff1a;你好&…

【部署LLaMa到自己的Linux服务器】

部署LLaMa到自己的Linux服务器 1、Llama2 项目获取方法1&#xff1a;有git可以直接克隆到本地方法2&#xff1a;直接下载 2、LLama2 项目部署3、申请Llama2许可4、下载模型权重5、运行 1、Llama2 项目获取 方法1&#xff1a;有git可以直接克隆到本地 创建一个空文件夹然后鼠标…

vscode无法自动补全

前提&#xff1a;安装c/c插件 c/c插件功能非常强大&#xff0c;几乎能满足日常编码过程中常用的功能&#xff1b;因此也包含自动补全的功能&#xff0c;开启方法如下&#xff1a; 文件->首选项->设置&#xff1a; 扩展->c/c->Intellisense&#xff0c;找到Intell…

docker-compose和docker compose的区别

在docker实际使用中&#xff0c;经常会搭配Compose&#xff0c;用来定义和运行多个 Docker 容器。使用时会发现&#xff0c;有时候的指令是docker-compose&#xff0c;有时候是docker compose&#xff0c;下面给出解释。 docker官方文档&#xff1a;https://docs.docker.com/c…

go语言(四)----指针

1、指针的示意图 package mainimport "fmt"func swap(pa *int,pb *int) {var temp inttemp *pa*pa *pb*pb temp}func main() {var a int 10var b int 20swap(&a,&b)fmt.Println("a ",a,"b ",b)}

Lazada不懂英文能做吗?Lazada国内店铺好做吗?-站斧浏览器

Lazada不懂英文可以做吗&#xff1f; Lazada作为一个国际化的电商平台&#xff0c;为了方便用户来自不同国家和地区的购物需求&#xff0c;提供了多语言支持。对于不懂英文的用户来说&#xff0c;他们同样可以在Lazada上进行购物。 首先&#xff0c;Lazada平台上的界面和商品…

TRB 2024论文分享:融合Transformer和自监督学习的长时交通流预测模型

TRB&#xff08;Transportation Research Board&#xff0c;美国交通研究委员会&#xff0c;简称TRB&#xff09;会议是交通研究领域知名度最高学术会议之一&#xff0c;近年来的参会人数已经超过了2万名&#xff0c;是参与人数和国家最多的学术盛会。TRB会议几乎涵盖了交通领域…

【管理篇 / 升级】❀ 13. FortiOS 7.4固件升级新规则 ❀ FortiGate 防火墙

【简介】飞塔防火墙的固件升级一直是所有厂家中最好的。只要有注册官方帐号&#xff0c;有注册设备&#xff0c;并且只要有一台设备在服务期内&#xff0c;即可下载所有型号的所有版本的固件。即使其它设备服务期已过&#xff0c;也可以通过固件文件手动升级&#xff0c;避免防…

three.js 点按钮,相机飞行靠近观察设备

效果&#xff1a; 代码&#xff1a; <template><div><el-container><el-main><div class"box-card-left"><div id"threejs" style"border: 1px solid red"></div><div class"box-right&quo…

unable to create new native thread 问题处理

目录 unable to create new native thread 问题处理一、背景二、该问题产生可能原因三、处理过程3.1 确认内存是否不足3.2 确认机器线程数达到限制 四、总结 unable to create new native thread 问题处理 一、背景 生产实时集群部分节点的部分任务失败触发自动重启&#xff…

Unity之铰链关节和弹簧组件

《今天闪电侠他回来了&#xff0c;这一次他要拿回属于他的一切》 目录 &#x1f4d5;一、铰链关节组件HingeJoint 1. 实例 2. 铰链关节的坐标属性 ​3.铰链关节的马达属性Motor &#x1f4d5;二、弹簧组件 &#x1f4d5;三、杂谈 一、铰链关节组件HingeJoint 1. 实例 说…