HTML

一、html介绍

HTML 指的是超文本标记语言 (Hyper Text Markup Language)

HTML 不是一种编程语言，而是一种标记语言 (markup language)

标记语言是一套标记标签 (markup tag)

HTML 使用标记标签来描述网页，通过标签完成网页的搭建。

html5扩展功能

语义化标签

本地存储<!– LOCAL STORAGE –>

兼容特性

2D，3D

动画过渡

CSS3特性

性能集成<!– web workrt –>运行在后台，不影响正常操作

第一个代码Hello World

可先创立好如下文件夹，并右键demo建立html文件，直接出现标准代码，输入相应代码使其运行。

在body标签内输入标题标签h1,输入内容，运行。

得到网页上的运行结果。

HTML与CSS交互（简单布局）

通过demo文件创建css文件。

在html文件中编写html程序：在head部分输入link，编码器直接将剩余部分补充完整，链接到之前创建好的css文件中。在 body中输入内容。*

在css文件中，输入相应内容（在后来的学习中需要搞清原理）其中border为外边框，solid为线，px为像素值。（之后详解）

得到运行结果（PS：第一次运行没有显示边框，检查代码发现有一行px后面未加分号）

二、简单认识标签

meta标签

utf-8为万国码，对中文有支持。用其他的可能会乱码（PS：曾经通过记事本进行编辑，默认值为ANSI，运行出的网页中中文为乱码）。content则是告知浏览器搜索用的关键词，使其被搜索到，如上图网购。

特殊符号

语义化的HTML标签

与段落有关的标签：

块元素和行内元素，后期要深入了解。

<div>,<span>为布局常用元素，后期要常用。

列表

有序与无序标签效果：

列表之间可以相互嵌套。

超链接和相对路径

构建一个新html文件A.html，超链接如下
<a href=”A.html”>跳转</a>，运行时新页面出现“跳转”，点击打开新网页，其中在前标签里添加target=”_blank”或target”_self”分别表明在新标签页打开链接网页、在当前页面打开链接网页。

图片和音视频

表单和表格

例如科协报名系统，后期学习，可连接到后端，处理数据。现进行模拟：

表单提交的相关元素：

表格的模拟

颜色

具体颜色代码不要求强记，具体可参考https://www.webhek.com/post/html-color-codes-and-names.html

CSS

一、css简介

css使用

二、CSS语法

初始

在CSS中，定义html文件中的标签，为其添加一些属性，如上图的例子，思考：在html文件中可不可以直接在标签里输入一些属性？css选择器的作用是拓展一些更多属性吗？

后期可以添加id选择器，例如几行P选择器，其中一个标签里加上id=“a”，那么在CSS文件里，加一个#a{}，以规定html文件中选定P元素的一些属性。

常用选择器分类

上图有部分模拟，具体的课后自我模拟。

复合选择器

关系选择器

伪类

要注意CSS中的插入顺序，可以完成一些动画效果。

样式的继承

选择器的权重

单位和颜色

CSS样式基础

Markdown基础语法

https://blog.loveliuyifei.top/markdown-ji-ben-yu-fa

https://www.runoob.com/markdown/md-tutorial.html