HTML+CSS基础笔记：从布局到超链接

4星 · 超过85%的资源需积分: 12 169 浏览量更新于2024-09-12 5 收藏 84KB DOCX 举报

本资源是一份由传智播客教师精心整理的关于HTML和CSS的7天学习笔记，涵盖了网页开发的基础知识。HTML和CSS是前端开发的两大核心技术，它们共同构建了网页的结构和样式。首先，HTML（超文本标记语言）是用于创建网页内容的基石。浏览器的作用就是接收服务器返回的HTML代码，然后按照预定义的规则将其解析成用户可理解的图形界面。常见的浏览器有Firefox、Internet Explorer（IE）和Chrome，它们都支持HTML标准。在HTML文档结构中，文档开始以`<!DOCTYPE>`声明指定文档类型，接着是`<html>`标签，包含`<head>`和`<body>`两个主要部分。`<head>`区包含了元数据，如`<title>`标签定义网页标题，`<meta>`标签用于提供生成者信息。`<body>`部分则放置网页的主要内容，如文本、列表、表格等。 HTML的语法强调使用标签来标记内容，如双标签``用于表示段落，单标签` `用于换行，`<img>`标签用于插入图片，属性如`src`、`alt`和`title`用于定义图片的来源、替换文本和鼠标悬停提示。表格是通过`<table>`、`<tr>`和`<td>`标签组合创建的，遵循合并而非拆分的原则。 CSS（层叠样式表）是用于设计网页布局和样式的语言。它与HTML并行工作，允许开发者控制文本的字体、颜色、布局以及响应式设计。CSS的重要概念包括选择器（如ID选择器、类选择器）、属性（如`width`、`height`）和值（如像素、百分比）。CSS的嵌套规则和盒模型（即元素的边距、填充和边界）也是核心概念。在编写HTML时，注意标签的正确使用，例如大小写不敏感但推荐统一为小写，标签必须成对出现或关闭。此外，属性值通常用引号括起来，并且多属性间用空格分隔。转义字符如`\n`（换行）、`\t`（制表符）等在需要特殊字符时会用到。这份笔记适合初学者系统学习HTML和CSS，从基础语法到实践应用都有所涉及，有助于快速理解和掌握这两项技能。通过连续7天的学习，读者将建立起扎实的前端开发基础，为进一步探索前端框架和响应式设计打下坚实的基础。

建议：任何时候做任何的网页内容块：先考虑设置宽度。

一：浏览器的作用：接收从服务器返回的字符串，按一定的规则解析为用户可以看懂的图

形界面。

二：常用浏览器：FF IE Chrome

三：超文本标记语言：HTML：超文本标记语言

四：文档结构：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transi$onal//EN"

"h'p://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<$tle>网页标题</$tle>

</head>

<body>

网页主体内容

</body>

</html>

五：HTML 语法

HTML 是标记语言，所以语法的学习其实就是对一些 W3C 组织定义好的具有特定含义

的标签的使用方法的学习。

标签

带有特殊含义的网页的标记元素

格式：<开始标签> 标签体 </结束标签>

特点

不区分大小写

标签名是固定的

分类

双标签如： XX 标签应该成对出现

单标签如：

属性

1. 写在开始标签上的名=“值”对代表该标签的属性 <font

color=“red”>。

2. 一个标签可以有多个属性，多个属性之间使用空格隔开。

3. 注意：属性值最好使用单引号或者双引号引起来。

六：文本标签：

H1~H6:从大到小，加粗，单独占据一行

Ol/ul:是对段落而言，也就是说一个段落对应着一个符号或者编号

下载后可阅读完整内容，剩余5页未读，立即下载

u012088400

粉丝: 0
资源: 95

HTML+CSS基础笔记：从布局到超链接

传智播客-PHP基础视频_html+css+js笔记

HTML5+CSS3从新手到高手网页设计与网站布局一书的所有源码和实例

《基于Web标准的网页设计与制作》源代码和素材

传智播客-PHP基础视频_html+css+js_源码+笔记

传智播客梅兰商城项目实战HTML+CSS源代码.rar

传智播客-张鹏-带你一周 HOLD 住 HTML + CSS

传智播客SpringBoot视频+代码+笔记

传智播客_张鹏_带你一周hold住html+css_第03讲_html编辑器及body详解.zip

CSS3教程 传智播客

2015传智播客jquery完整版笔记

最新资源

CSS3教程传智播客