HTML 学习- day01-CSDN博客

本文链接：https://blog.csdn.net/lxt185794853/article/details/130119540

本文介绍了HTML的基本概念，包括HTML是超文本标记语言，用于编写网页。讨论了网页的构成，标记的分类，如单标记与双标记，以及行内元素和块级元素的区别。还详细讲解了属性的使用方法，以实例展示了如何设置颜色、大小等属性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、HTML
1、什么是HTML
超文本标记语言
   计算机语言
2、作用
       写网页
3、什么是网页
       文件，或者 .html
       借助浏览器 (后面:浏览器兼容问题 )
4、写什么
       版本声明 heml5 <!doctype html>
       document:文档 type：类型
       HTML注释
            快捷键 Ctrl+/
       标记、标签、元素、Tag
二、标记的分类
   1、根据标记的个数
                   单标记<关键词/>
                   hr 、 br 、 img
                   双标记 <关键词> </关键词>
                   b 、 u 、 i 、 p 标题元素 head 、 body、 html、 title、 vedio、 del
   2、根据元素是否会自动换行
                   行内元素：不会自动换行
                   img 、 b 、 u 、 i 、 vedio 、del

                   块级元素：自动换行
                   hr p 标题元素
三、属性
       属性名=“属性值”

       属性之间不区分先后顺序、多个属性之间用空格分隔
       hr color="red"

       vedio （ width、 height、 src）

       img （width、 height、 src）

               p 标题元素 hr 设置水平方向的对齐方式

               align="left"/right/center

<!DOCTYPE html>  <!--版本声明 5.0-->
 <html>   
	<head>
		 <meta charset="utf-8" />   
		 <!-- ---防止网页出现文字乱码   首先来说明一下“utf-8”是一种字符编码。
		                              charset=”utf-8”是告知浏览器此页面属于什么字符编码格式，下一步浏览器做好“翻译”工作	  
		  常见的字符编码有：gb2312、gbk、unicode、utf-8
		 
		 gb2312： 代表国家标准第2312条，其中是不包含繁体的（虽然咱们不怎么使用繁体了，但是台湾还在使用繁体,那怎么办呢？）。
		 gbk： 国家标准扩展版（增加了繁体，包含所有亚洲字符集）。
		 unicode： 万国码（字面意思你也懂的）。
		 utf-8： unicode的升级版。
		 -->
		
		<title>我的第一个网页</title>  <!------浏览器标签-->
	</head>
	<body>  <!---浏览器主题内容    Tab键快捷键自动补全          -->  
		济南天气开始热了.....<br>
		 <b>济南天气开始热了....</b>  <br><!-- b标记能够加粗字体 -->
		 <u>济南天气开始热了....</u>   <br><!--u标记能够添加下划线显示   -->
		<i>济南天气开始热了....</i>   <br><!-- I标记能够让文字倾斜显示   -->
		<del>济南天气开始热了....</del>  <br>
		<hr color="crimson">
		<hr color="#ff9597">
		<hr color="blue">                 <!--  hr——  水平线   
		
		
		属性：描述标签上的特征
		书写：1）如果双标签，属性值必须使用英文单引号或双引号括起来
		2）属性名和属性值同时存在，属性值必须使用英文单引号或双引号括起来
		3）如果给标签添加多个属性，属性之间使用恐吓隔开下
		
		常见属性：
		color="" 颜色
		size=""大小
		width=""宽度
		height=""高度
        align=""对齐方式  left  center  right
		...
		
		#标题   （6级标题）
		
		<h1>内容不限</h1>
		<h2>注意双标记语法</h2>
		<h3>标题元素有6个</h3>
		<h4>h#是一种偷懒的写法</h4>
		<h5>应该是从h1~h6</h5>
		<h6>标题元素会自动换行</h6>
		
		特征：字号由一级到六级逐渐变小，能自动换行，有加粗效果
		内容默认居左
		属性：align
		
		
		#段落
		<p>段落内容....</p>
		特征:能自动换行,内容默认居左  有段间距
		属性:align
		
		
		#图片
		语法:<img>
		属性:src="图片路径"   src="\img\123.jpg"
		width=""  
		
		图片来源:本机、网络


		-->
		
	</body>
</html>