[初学HTML5日记]又是元气满满的一天

诗鱼poem、

已于 2022-03-19 22:17:02 修改

阅读量174

点赞数 5

分类专栏：学习使我快乐文章标签： html5

于 2022-03-19 22:16:30 首次发布

本文链接：https://blog.csdn.net/weixin_51560236/article/details/123601591

版权

学习使我快乐专栏收录该内容

5 篇文章 1 订阅

订阅专栏

开始啦

新的学期开始了，终于学到了一直想学的HTML，不得有点小开心。然后自己想记录一下自己的学习过程这是开始的代码段：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>这个是标题</title>
</head>
<body>
这是网页显示的内容，通过<body><body/>来表达自己想实现的内容
</body>
</html>

HTML5的基本格式

<!doctype html>标记：用于向浏览器说明当前文档使用哪种HTML标准规范（只要开头处使用）。
<html>标记-根标记：用于告知浏览器这是一个HTML文件，标志着文档的开始，而</html>标志着文档的结束
<head>标记-头部标记：主要封装其他位于文档头部的标记，如<title>,<meta>,<lin>,<style>等等，用来描述文档的关系，一个HTML只能有一对<head>标记
<body>-主体标记：浏览器中显示的所有文本，图像，音频，视频等信息的必须在<body>标记内，位于<head>之后，与其是并列关系，也是HTML的唯一

HTML5的语法

标记不区分大小写
允许属性值不使用引号

<input checked=a tyoe=checkbox />
<input checked="a" tyoe="checkbox" />

允许部分属性值的属性省略

<input checked="checked" type ="checkbox" />
<input checked type ="checkbox" />

HTML5可以省略部分属性值的属性省略：checked readonly defer ismap nohref noshade nowrap selected disabled multiple noresize

HTML5的标记

双标记与单标记

<!-- 双标记指开始和结束两个标记符组成的标记 -->

<标记名>内容</标记名> 

<p>内容</p>

<!-- 单标记也称空标记，指用一个标记符号即可完整描述某个功能的标记 -->

<标记名  />

<hr  />

如框内部所描

标记的属性

我们需要HTML显示更多的信息，不一样的感观，所以我们要开始设置不同的属性，使文本更加突出，或者使页面五颜六色的

比如这样，一下一下的：

基本的语法格式为:

<标记名 属性1="属性1" 属性2="属性2" >内容</标记名>

属性1为属性名 "属性1"为属性值

然后还有一种嵌套关系，直接举例子吧

<p>我们可以这样<strong>这是加粗的</strong>嵌套</p>

然后它就会变成这样子，理解的扣三室一厅/手动狗头

HTML5文档头部相关标记

设置页面标题的标记<title>

<title>my html</title>

结束页面的这个

定义页面元信息标记<meta />

下面这个是<meta />常用的设置

<meta name='作者姓名：鲸灵' content='值'>

name是属性值 content就是原来定义name的具体信息

设置字符集

<meta http-equiv="Content-type" content="text/html;charset=utf-8" />

用；隔开，用于说明文档类型为html，字符集为utf-8（国际化编码）

引用外部文件标记

在<head>标记中使用<link />标记引用外部外部文件

<link 属性="属性值" />

属性名	常用属性值	描述
href	URL	指定引用外部文档的地址
rel	stylesheet	指定当前文档与外部文档的关系该属性值通常为stylesheet, 表示定义一个外部样式表
type	text/css	引用外部文档的类型为CSS样式表
type	text/javascript	引用外部文档的类型为javascript脚本

例如，使用<ink>标记引用外部 CSS 样式表：

<link rel-"stylesheet" type-"text/css" href-"style.css"/>

上面的代码，表示引用当前 HTML5 页面所在文件夹中文件名为“style.css”的 CSS 样式表

内嵌样式标记

<style 属性="属性值">样式内容</style>

在HTML5中，<style>相对应的属性值为text/css，表示内嵌的CSS样式

<title>2</title>
	<style type="text/css">
		h2{color: antiquewhite}
		p{color: aqua}
	</style>
</head>

<body>
	<h2>呼呼</h2>
	<p>哈哈哈</p>
</body>

好啦，呼啦啦，下次继续/手动没有表情包

诗鱼poem、

关注

5
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
[初学HTML5日记]又是元气满满的一天

开始啦新的学期开始了，终于学到了一直想学的HTML，不得有点小开心。然后自己想记录一下自己的学习过程
复制链接

扫一扫

专栏目录