- 文档声明
-
<!DOCTYPE html> 说明文档类型:html
-
- html元素与HTML元素
- HTML元素:HTML语言下包含的所有元素
- html元素:是具体的<html>元素,是根元素,其他所有元素都是其后代元素
- <html lang="en"> lang属性 作用:帮助语音合成,帮助翻译工具进行翻译
- head元素
- head元素中基本为整个页面相关的配置信息(也称为:元数据)
- head元素中常用的两个标签:
<!-- 编码方式 --> <meta charset="UTF-8"> <!-- 网页的标题 --> <title>head元素的学习</title 实例: <html> <head> <title>文档标题</title> </head> </html>
- body元素
- body元素是网页的主体内容
- 在body中 HTML常见的元素(90%使用率)
- p元素、h元素
- p元素:段落(Paragraph)
- h元素:标题 (Heading) <h1> - <h6>
- img元素、a元素、iframe元素
- div元素、span元素
- p元素、h元素
- img元素
- img元素:图像,图片(image)
- 是一个可替换元素(别的元素可对其进行替换)
- 常见属性:src 、 alt
<!-- src:source(源) --> 必需元素
alt属性,非必需元素, 含义:当图片加载不成功,可显示文字提示;为语音阅读提供方便
- 设置img的src中,需要给图片设置路径:网络图片,本地图片
- 本地图片的路径两种方式
- 绝对路径(几乎不用)
- 从电脑的根目录开始一直到资源的路径
- eg: <img src="C:\Users\Administrator\Desktop\前端\HTML_CSS\images\day02.jpg" alt=""> (此处 \ 要换为 / )
- 从电脑的根目录开始一直到资源的路径
- 相对路径(常用)
- 相当于当前文件的一个路径
- . 代表当前文件夹(可以省略)
- .. 代表上级文件夹(可依次找出目录对应文件)
- 绝对路径(几乎不用)
- 对于网页而言,无论什么操作系统,路径分隔符都是 / ,而不是 \
- a元素
- a元素(anchor 锚点):超链接,用于打开新的URL
- 常见属性
- href(Hypertext Reference 超文本引用):打开URL
- target:该属性指定在何处显示链接的资源
- _self:在当前窗口打开URL
- _blank:在新的窗口打开URL
- 锚点链接
- 在要跳转的元素上定义一个id属性
- 定义a元素,并且a元素的herf指向对应的id
- a元素和img元素结合使用
- a元素还可以进行发送邮件或者下载压缩包
- iframe元素
- 可以在此页面中调用网页,但很多网站会拒绝调用
- 属性:frameborder(边框):0(不显示)1(显示)
- div元素、span元素
- div元素(division):分开,分配
- span元素
- div元素、span元素 是纯粹的容器
- div元素:多个div元素包裹的内容会在不同行显示
- span元素:多个span元素包裹的内容会在同行显示
- 不常用元素(可用css代替)
- strong...
- 全局属性(要求掌握)
- id:唯一标识符,文档中名字必须唯一
- class:给一个元素一个类名(添加多个时,以空格分割)
- eg:
<span class="keyword name">JS</span>
- eg:
- style:给元素添加内联样式
- title:鼠标在上面时可以显示解释说明,不必须
- 字符实体(重要)
- 用于浏览器解析无法识别的字符,比如:< 等
大于,小于号:代码: <span><hhhhhhhhhhhhhh></span> 实现结果:<hhhhhhhhhhhhhh> 空格实现: 代码:<p> hhhhhhhhhhhhhhhhfgdll <span>xxx xx</span> aksalkkkkkkkkkkkkkkkkkk </p> 实现结果:hhhhhhhhhhhhhhhhfgdll xxx xx aksalkkkkkkkkkkkkkkkkkk
- 用于浏览器解析无法识别的字符,比如:< 等
HTML基本元素 html+css day 02
最新推荐文章于 2024-10-01 23:46:18 发布