HTML和CSS笔记标签的认识

最新推荐文章于 2024-07-18 15:09:36 发布

不高山mou

最新推荐文章于 2024-07-18 15:09:36 发布

阅读量239

点赞数

分类专栏： HTML 文章标签： html5

本文链接：https://blog.csdn.net/c1348208475/article/details/113494386

版权

HTML 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

HTML和CSS笔记
1.第一个网页

<!doctype html>
<html>
	<head>
	<!--注释：
	head内：网页名字，不显示在网页内容板块
	HTML：结构	CSS：样式	JS：功能
	keywords:网页搜索关键词
	description：描述
	title标签的内容会成为浏览器的超链接
	重定向：三秒跳转到另一个网站
		<meta hppt-equiv="refresh" content="3;url=https://www.baidu.com">
	-->
		<meta charset="uft-8" name="keywords" content="购物，HTML">
		<meta name="description" content="网页制作">
		<title>这是第一个网页</title>
	</head>
	<body>
	<!--注释：
	1.自结束标签：<img><input>
	不用成对
	2.	8bites=1b;
		1024b=1kb;
	3.字符编码：UTF-8
	4.实体
		&nbsp:空格
		&gt:>
		&lt:<
		&copy:版权符号
		5.块标签：独占一行
			<p>：段落	<hgroup>:标题分组
		6.行内元素：不分行
			<em>:斜体	<strong>：粗体	<q>:短引用	<blockquote>:长引用	<br>:换行
			注：块元素不能写在行内元素
	-->
		<h1>第一级<font color="red" size='20'>标题</font></h1>
	</body>	
<html>

2.语义标签
header:网页的头
main:网页的主体
footer:网页的底部
nav:网页的导航
asider:侧边栏
article:独立的文章
section：独立的区块
div:代替以上全部
span:行内元素，用于选中文字

3.列表

//无序列表：ur创建，每一项li
<ul>
	<li>结构</li>
	<li>表现</li>
	<li>行为</li>
</ul>

//有序列表：ol
<ol>
	<li>结构</li>
	<li>表现</li>
	<li>行为</li>
</ol>

//定义列表<dl>
<dl>
<dt>结构</dt>
<dd>标题和段落</dd>
<dd>标题和段落</dd>
</dl>

//注：列表可以相互嵌套

4.超链接:行内元素，可以嵌套任意

//_blank:新空白网页	;_self:当前网页
<a href="同一目录下网页" target="_blank">超链接</a>
//相对路径
./当前文件的目录
../：上一级目录

<a href="#buttom">去底部超链接</a>
<a id="buttom" href="#">去顶部超链接</a>//回到顶部
<a href="javascript:;">去底部超链接</a>//不跳转

5.图片标签

//src:外部图片的路径
//alt:搜索引擎能否搜索到关键字，若不想被识别，则不写。
//不建议修改图片尺寸，注意缩放后说
<img width="100" src="./img/1.png" alt="无图">

//内联框架,小窗口
<iframe src="hppt://www.qq.com" width="600" height="800" frameborder="5"></iframe>

//音视频（每个浏览器音乐播放器不一样，不采用）
//用户控制可视	自动播放	循环播放
<audio src="" controls autoplay loop></audio>
<video src="" controls autoplay loop></video>
<video controls>//兼容性问题
	source=".webm"
	source=",mp4"
	<embed src=".mp4" type="video/mp4" width="300" height="30">//IE8，淘汰
</video>
//一般不采用本地音视频，将音视频传到其他网
<iframe src="hppt://v.qq.com/上传视频/player" width="600" height="800" frameborder="5"></iframe>

不高山mou

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML和CSS笔记标签的认识

HTML和CSS笔记1.第一个网页<!doctype html><html> <head> <!--注释： head内：网页名字，不显示在网页内容板块 HTML：结构 CSS：样式 JS：功能 keywords:网页搜索关键词 description：描述 title标签的内容会成为浏览器的超链接重定向：三秒跳转到另一个网站 <meta hppt-equiv="refresh" content="3;url=https://www.
复制链接

扫一扫