html 基础
1.网页的组成
任何一个页面都有三部分
| 序号 |
内容 |
描述 |
| 1 |
文本内容 |
用户可见内容 |
| 2 |
其他资源的引用 |
图片，视频，音频。。。 |
| 3 |
各种各样的标签 标记 |
对文本，其他资源的描述 |
<p>我是PHP中文网的讲师</p><img src="logo.png" alt="log" />>
2. html 设计思想
- html 文档中的一切,都是基于标签实现的
- 标签就类似于超市中玲琅满目的商品,你能通过一个标签快速识别并找到它们
- 页面中的每一块内容,如果想识别出来,同样也需要给他们贴上不同的标签
- html 是超文本标记语言(下表描述并不精准,但力求简要易记)
| 术语 |
描述 |
| 超文本 |
是指包含有超链接的文本 |
| 标记 |
就是用来描述内容的固定标签 |
| 语言 |
html 并不编程语言,只是书写 html 文档的工具 |
3.html 页面结构
<!DOCTYPE html><!-- 通知浏览器，我是一个 html文档 --><html lang="zh-CN"> <!-- en 是英文模拟 ，zh-cn是简体中文模式 --> <head> <!-- head中的内容，用户不敢兴趣，或者不需要用户看到，给浏览器或者开发者 --> <!-- 元数据：解释数据的数据，描述某种特定信息的数据？ --> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>新页面</title> </head> <body> <h2>php中文网欢迎大家</h2> </body></html>
元素，属性和值
| 元素 |
标签 |
描述 |
| 非空元素 |
双标签 |
<p>学习让我很快乐</p> |
| 空元素 |
单标签 |
<img src='1.jpg' alt=""> |
4.2 属性和值
4.2.1 基本语法
- 属性: 必须写到元素的 “起始标签” 中,由属性名和属性值二部分组成
- 语法:
属性名="属性值",属性名推荐只使用小写字母,属性值推荐加上双引号 - 案例:
<input type="password" maxlength="20" placeholder="至少8个字符" required>
| 序号 |
值类型 |
描述 |
| 1 |
字符串 |
<p class="active">...</p> |
| 2 |
预定义值 |
<input type="text"> |
| 3 |
指定格式 |
<a href="https://php.cn">...</a> |
| 4 |
数值 |
<table width="200">...</table> |
| 5 |
布尔值 |
<input type="email" required> |
布尔属性的值是可选的, 只要元素中出现该属性,表示它取真值
4.2.2 三大通用属性
| 序号 |
属性名 |
描述 |
举例 |
| 1 |
id |
元素的唯一标识 |
<div id="wrap">...</div> |
| 2 |
class |
给元素添加类样式 |
<div class="box">...</div> |
| 3 |
style |
设置当前元素样式 |
<div style="...">...</div> |
这几个属性,几乎可以添加到任何元素上
5.URL
6.文件与文件夹名称
- 使用小写字母书写：
course/1088.html - 采用合适的扩展名
.html - 熟练使用连接线
- 而不是下划线 _分隔多个单词
