HTML&CSS总结

HTML（HyperText Markup Language）和CSS（Cascading Style Sheets）是构建网页的基石，它们共同决定了网页的结构和样式。HTML负责定义网页的内容和结构，而CSS则用于美化和布局这些内容。 **HTML知识点** 1. **结构元素**： - ``到``用于定义不同级别的标题。 - ``是段落标记。 - ``和``用于加粗文本，``更强调语义。 - ``和``用于斜体，``强调语义。 - ``和``分别表示上标和下标。 - ``、``和``用于下划线、插入和删除内容，``在HTML5中不再推荐使用。 - ``用于展示设计者或联系人信息。 - ``用于缩写词，title属性提供完整形式。 - ``和``用于短引用和长引用，``在IE中不自动添加引号。 2. **列表**： - ``和``创建有序列表。 - ``和``创建无序列表。 - ``, ``和``用于定义列表。 3. **链接**： - ``标签创建链接，`href`属性指定链接地址。 - `target="_blank"`使链接在新窗口打开。 - `#`用于链接到页面内部锚点。 - `mailto:`用于创建邮件链接。 4. **图像**： - ``标签插入图像，`src`属性指定图像源，`alt`提供描述，`title`显示提示。 - `width`和`height`定义图像尺寸。 5. **表格**： - ``创建表格，``代表行，``表头，``数据单元格。 - `colspan`和`rowspan`用于合并单元格。 - ``, ``和``分别表示表头、主体和页脚。 6. **表单**： - ``开始表单，`action`指定提交地址，`method`（GET或POST）定义提交方式。 - ``用于用户输入，`type`属性定义输入类型，如文本（text）、密码（password）等。 - ``和``用于下拉列表。 - ``提供多行文本输入。 - ``创建按钮，`type`可以是submit或reset。 **CSS知识点** 1. **基础**： - CSS用于控制网页元素的外观和布局。 -选择器（如标签选择器、类选择器、ID选择器）指定要应用样式的元素。 -属性（如color、font-size、background-color）定义元素样式。 -规则集由选择器和花括号内的属性声明组成。 2. **颜色**： -使用颜色名称、十六进制、RGBA、HSL或HSLA定义颜色。 3. **文本**： - `font-family`指定字体，`font-size`设置字体大小。 - `color`改变文本颜色，`text-align`控制文本对齐。 4. **盒子模型**： -包括margin、border、padding和content，影响元素的总尺寸。 - `box-sizing`属性可以设置为`content-box`（默认）或`border-box`。 5. **布局**： - `display`属性用于设置元素的布局模式，如block、inline-block、flex或grid。 - `position`（static、relative、absolute、fixed）控制元素定位。 - `float`用于创建浮动布局。 - CSS3的`flexbox`和`grid`提供更强大的布局控制。 6. **图像**： - `background-image`添加背景图片，`background-repeat`、`background-position`和`background-size`控制其行为。 - `background`属性可以组合多个背景属性。 7. **CSS3新增特性**： - `transition`和`animation`实现平滑过渡和动画效果。 - `border-radius`创建圆角。 - `box-shadow`添加阴影效果。 - `transform`用于旋转、缩放、位移等变换。 8. **HTML5布局**： - ``, ``, ``, ``, ``和``用于创建语义化的页面结构。 - ``和``组织内容区块。 - ``和``用于图文说明。以上只是HTML和CSS部分基础知识的概览，实际上这两个领域非常广阔，包括响应式设计、CSS预处理器、JavaScript交互、Web性能优化等都是深入学习的重要部分。持续学习和实践是成为优秀前端开发者的关键。