58_h5笔记4_基础标签

h标签
1. 标题语义
2. 独占一行
3. 只有h1到h6,h1最大
4. 慎用h1标签,一个文件只有一个,和SEO有关
p标签
1. 段落语义
2. 独占一行
hr标签
1. 显示一条分割线
2. 是单标签<hr/>
3. 有无斜划线均可以,
4. 开发中不推荐使用,用css盒子模型来代替
img标签
1. 不会独占一行
2. src属性
  1. 写图片的相对路径;
  2. 绝对路径可移植性不好
3. 宽高属性width和height
  1. 指定宽高,图片就显示该宽高;
  2. 不指定,就显示图片原始的尺寸;
  3. 想要图片不被拉伸压缩变形,就只指定width或者height,系统会自动等比拉伸
4. title属性
  1. 鼠标悬停在上边,显示的文字
5. alt属性
  1. alternate,交换的意思
  2. 如果指定的图片找不到时,图片占位的显示文字
6. ```
<img src="images/test.jpg" width="100" alt="对不起, 你需要查看的图片不见了" title="这个是我的微信二维码图片">
```
br标签
1. 单标签<br/>,表示换行
2. 表示不另起一个段落换行,即描述的语义是连续的;
3. 实际中绝大部分的换行,即是语义表示结束,另起一行,都用p标签来表示
a标签
1. anchor的意思,锚点
2. 控制页面的跳转的作用
3. 效果:下划线,悬停变小手掌,点击后变颜色
4. 可以中间是文字,也可以是图片,即中间是一个image标签
5. target属性
  1. _self为当前选项卡,_blank新增选项卡中打开
6. title属性
  1. 悬停显示文字
7. 假链接
  1. 不跳转到指定界面,开发时,先现在那里
  2. href="#":表示回到网页的顶部
  3. href="javascript:"表示不跳转,不回到网页的顶部
  4. ```
  <a href="#">点我1</a>
  <a href="javascript:">点我2</a>
```
8. 锚点作用
  1. 跳转到当前页面的某一个标签位置
    1. 指定某一个标签的id"location"
    2. a标签的href属性设置为:href="#location"
    3. ```
    //指定位置标签
    <h2 id="bottom">我是锚点测试界面33333</h2>
    
    //负责跳转的a标签
    <a href="#bottom">跳转到指定位置</a>
```
2. 跳转到指定页面的某一个标签位置
  1. href拼接上html的路径<a href="01-锚点链接.html#location">跳转到指定位置</a>
base标签
1. 专门用来统一当前网页中,所有的a标签的跳转方式target
2. base必须嵌套在head标签里面
3. 如果标签上指定了target,base中也指定了target,那么会按照标签上指定的来执行
4. ```
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>base标签</title>
    <base target="_blank">
</head>
<body>
```

58_h5笔记4_基础标签

猜你喜欢