一、什么是 HTML 1、全称是HyperText Markup Language翻译过来叫 “超文本标记语言”。2、只要记住一句话HTML是用来搭建网页 “结构” 和 “内容” 的语言。二、HTML 长什么样1、HTML的核心是 “标签”比如h1、p、img这些它们就像一个个 “容器”用来装不同的内容。2、一个最基础的 HTML 代码页面长这样!DOCTYPE html html langzh-CN head meta charsetUTF-8 title我的第一个网页/title /head body !-- 这里是页面的内容 -- h1这是页面的大标题/h1 p这是一段普通的文字内容用来介绍页面信息。/p img srchttps://example.com/photo.jpg alt示例图片 button这是一个按钮/button /body /html3、第一列为 HTML 的 结构!DOCTYPE html文档类型声明告诉浏览器这是HTML5网页html根标签整个网页的最外层容器head头部标签网页的配置区用户看不见body主体标签网页的内容区用户能看见的所有内容都在这 h1 p img button 这些是网页内容型标签可放置标题、段落、图片、交互功能4、标签标签是 HTML 的基础单元所有网页内容都是由他拼出来双标签拥有完整的头尾包裹内容例如p 内容写在这里 /p单标签只有一个标签内容可写在标签前后例如 input type # 内容写在这里标签嵌套把一个标签放在另一个标签的内部例如div p这是段落标签a href#这是超链接标签/a/p /div三、什么是 CSS如果 HTML 是人的骨头那 CSS 就是人的 —— 皮肤、衣服、妆容CSS 的全称是 Cascading Style Sheets翻译过来叫 “ 层叠样式表 ”简称CSS 样式1、代码示例在学习阶段CSS 样式可以写在style 这里放CSS样式 /style!DOCTYPE html html langen head meta charsetUTF-8 meta nameviewport contentwidthdevice-width, initial-scale1.0 title背景复合属性/title style div { width: 1500px; height: 1500px; /* 缩放需要 / 隔开 */ background: pink url(../../../2.png) no-repeat top center/contain; font-size: 50px; } /style /head body div这是网页背景图/div /body /html2、效果展示总结1、HTML 是用来放内容CSS 是用来美化页面2、HTML CSS 可以制作一些网页效果但还不能实现交互需要学习 JavaScript后续会讲解