H系列标签(Header 1~Header 6)
- 用于给文本添加标题语义
-
注意点:
- H标签是用来给文本添加标题语义的, 而不是用来修改文本的样式的
- H标签一共有6个, 从H1~H6, 最多就只能到6, 超过6则无效被H系列标签包裹的内容会独占一行
- 在H系列的标签中, H1最大, H6最小
- 在企业开发中, 一定要慎用H系列的标签, 特别是H1标签. 在企业开发中一般情况下一个界面中只能出现一个H1标签(和SEO有关)
<h1>我是标签</h1>
<h2>我是标签</h2>
<h3>我是标签</h3>
<h4>我是标签</h4>
<h5>我是标签</h5>
<h6>我是标签</h6>
P标签(Paragraph)
- 告诉浏览器哪些文字是一个段落
-
注意点:在浏览器中会单独占一行
Hr标签(Horizontal Rule)
- 在浏览器上显示一条分割线
- 注意点:
- 由于hr标签是用来修改样式的, 所以不推荐使用. 今后开发中添加水平线一般都使用CSS盒子来做
img标签
- 在网页上插入一张图片
- 标签的属性
- src(source) 告诉浏览器需要插入的图片路径, 以便于浏览器到该路径下找到需要插入的图片
- alt(alternate) 规定图像的替代文本, 只有在src指定的路径下找不到图片,才会显示alt指定的文本
- title 悬停文本(介绍这张图片, 只有在鼠标移动到图片上时才会显示)
- 注意点:
- img标签添加的图片默认不是占一整行空间
- 如果想让图片等比拉伸, 只写高度或者宽度即可
br标签
- 让内容换行
- 注意点:
- br的意思是不另起一个段落进行换行, 而网页中99.99%需要换行时都是
因为另起了一个段落, 所以应该用p来做
- br的意思是不另起一个段落进行换行, 而网页中99.99%需要换行时都是
相对路径和绝对路径
- 绝对路径
- 从电脑的具体盘符开始寻找我们需要的资源
- 相对路径
- 一个文件相对于另外一个文件的位置寻找我们需要的资源
- 在企业开发中一般使用相对路径,因为绝对路径的可移植性太差
- 相对路径几种查找方式
- 同级
- 直接编写图片名称
- 下级
- 相对当前目录有几个文件夹,就在后面依次补全几个文件夹名称即可
- 上级
- ../代表访问上级目录
- 同级
a标签
- 用于从一个页面链接到另一个页面
- 注意点:
- 在a标签之间一定要写上文字, 如果没有, 那么在页面上找不到这个标签
- a标签也叫做超级链接或超链接
- 标签属性
- href(hypertext reference) 指定跳转的目标地址
- target 告诉浏览器是否保留原始界面, _blank保留, _self不保留
- title 悬停文本(介绍这个链接, 只有在鼠标移动到超链接上时才会显示)
- base标签和a标签结合使用
- 如果每个a标签都想在新页面中打开,那么逐个设置a标签的target属性比
较麻烦, 这时我们可以使用base和a标签结合的方式,一次性设置有a标
签都在新页面中打开 - 格式:
<base target="_blank" /> -
注意点:
- base必须嵌套在head标签里面
- 如果标签上指定了target,base中也指定了target,那么会按照标签上指定的来执行
- 如果每个a标签都想在新页面中打开,那么逐个设置a标签的target属性比
- a标签其它用法
- 假链接(本质是跳转到当前页面)
- 格式
<a href="#">江哥博客</a>- 这种假链接可以从底部跳转到当前页面顶部
- 格式
<a href="javascript:;">江哥博客</a>- 这种假链接点击后无变化
<a href="#">简书4</a><br> <a href="javascript:;">简书4</a><br> - 格式
- 跳转到指定页面的指定位置
- 格式: <a href="01-锚点链接.html#location">跳转到指定位置</a>
- 只需要在01-锚点链接.html页面添加一个id位置即可
- 假链接(本质是跳转到当前页面)
