2021-08-03

最新推荐文章于 2021-11-10 17:26:45 发布

SuperLuxy

最新推荐文章于 2021-11-10 17:26:45 发布

阅读量109

点赞数

分类专栏：初学适用文章标签： html5

本文链接：https://blog.csdn.net/qq_45158336/article/details/119390967

版权

初学适用专栏收录该内容

8 篇文章 2 订阅

订阅专栏

可以使用.html与.htm作为HTML文件的后缀名（扩展名）

1.Html结构,css表现,JS行为
    网页框架搭建,用于描述页面的结构
    用于表现网页元素的样式,颜色,字体,背景
    用于响应用户操作,动态+事件
2.注释 ctrl+/ <!-- 导航栏 --> <!--/ 导航栏 -->
养成良好习惯，用于给其他开发人员表达代码结构
3.文档结构 
    <!-- 文档头信息 -->
    <!-- h5的文档声明，声明当前的网页是按照HTML5标准编写的编写网页时一定要将h5的文档声明写在网页的最上边。
    -->
    <!DOCTYPE html>
    <!-- ”en”代表英语，”zh-CN”代表中文 -->
    <!-- 只有两个子标签 head:浏览器设置 body：可视区展示 -->
    <html lang="en">
    <!-- head标签，该标签中的内容，不会在网页中直接显示，它用来帮助浏览器解析页面的 -->
    <head>
    <!-- 
            字符编码，浏览器会根据字符编码进行解析
            常见的字符编码有：gb2312、gbk、unicode、utf-8。
    -->
    <meta charset="UTF-8">
    <!-- 以 1:1 的比例呈现，不会有任何的缩放。
        -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- 浏览器选项卡上的名字 -->
    <title>Hello HTML</title>
    </head>
    <body>
    <!-- 在body里的内容都是显示在浏览器的视图区的 -->
    </body>
    </html>
4.属性
		title  鼠标悬停后的提示文字
		id 身份证，唯一标识符
		class 类
		style 样式  行内样式		优先级最高
5.实体
    空格 &nbsp;
		<    &lt;
		>    &gt;
6.块级 行内

		块级 div p h1-h6 ul/ol-li
		特点	
					1.独占一行
					2.默认宽度100%，如果没有父元素的话，宽度相对视图区而言，高度由子元素及其内容决定，可以直接设置宽高
					3.块级元素可以包含行内与块级，而行内元素只能包含行内

		行内 span a img strong i em 
		行内 （img input 特殊行内，可以直接设置宽高，置换元素）
		特点  
					1.与其他元素共享一行
					2.宽高由自身决定
					3.行内元素只能包含行内

    块级与行内区别（面试题   考率80%）
					1.块级独占一行，行内共享一行
					2.块级可以直接设置宽高，而行内不行
					（通过css的display属性，取值为inline-block/block，这样可以给行内元素设置宽高）
					span{
						display：block/inline-block；
						width：
						height：
					}
					3.块级可以包含行内与块级，而行内只能包含行内

7. a 标签
		href 放跳转路径 相对./   ../  或者绝对路径
		     http://ip:端口号/项目名/文件名
	  target  跳转页面打开位置
				 _self 默认，在当前窗口打开
				 _blank  新窗口打开

8. img  放图片的元素
		src 放图片路径  相对./   ../  或者绝对路径
		     （一般用相对路径，网页下载到本地后用./ ../使用）
		width 宽
		height 高
		tittle 鼠标悬停后的提示文字

9. p标签 段落元素
		段落标签用于表示内容中的一个自然段
		p标签中的文字，会独占一行，并且段与段之间会有一个间距（16px的上下margin）

10.h1-h6
		常用h1（一级标题）,h2,h3 

11.br换行
	 hr分割线  二者都是自结束标签

margin or padding：0 0 0 0 
    如果写一个值 是上下左右边距都是这个值
    如果写四个  边距顺序 上右下左
		如果写两个  第一个数是上下的边距  第二个值是左右的边距
		如果写三个  第一个是上 第二个是左右 第三个是下