H5关于标签的那些事

山不在高,有仙则名;水不在深,有龙则灵

多学总是好的,闲来无事,了解下前端web
标签
H标签的作用:用于给文本添加标题语义,主要从H1-H6,
H系列标签会独占一行 当然超过H6则无效,企业开发中 慎用H标签
特别是H1标签,一般只会用到一次,作为标题用或者非常醒目的地方

标签

告诉浏览器那些是段落,会单独占一行,中间可以组合其他标签
比如

跳转

标签
hr标签主要是用来作为线用的
标签
br标签主要是用来作为换行的,但是不是分段
比如文字`天猫搜索`在天猫后面加一个该标签,可以让文字两两对齐
标签
相当于分块,应该是比较独立的区域
是一个块级元素。这意味着它的内容自动地开始一个新行。实际上,换行是
固有的唯一格式表现。可以通过
的 class 或 id 应用额外的样式。 不必为每一个
都加上类或 id,虽然这样做也有一定的好处。 可以对同一个
元素应用 class 或 id 属性,但是更常见的情况是只应用其中一种。这两者的主要差异是,class 用于元素组(类似的元素,或者可以理解为某一类元素),而 id 用于标识单独的唯一的元素
标签
控制页面与页面之间的跳转  必须有href 属性
a标签中有个target属性 该属性用作如何跳转
_self:不新建界面当前页面跳转 
_blank:新建一个页面
标签也有title属性 和 img 的一样

        

跳转

跳转新窗口

标签
加载图片的标签
title标签:当鼠标移动到图片上面会显示该title 的值
注意src的路径问题 ../是切换到上级目录

        

标签
base标签 指明当前网页所有a标签如何打开,必须在标签中
当然如果我们在标签中如果再进行单独设置target属性,那么会依照该属性来执行

     

假链接
下面两个都可以作为假链接 但是 # 可以回到顶部
        居然是假链接
        居然是假链接JS
锚点
当我们想实现点击目录进行跳转到指定位置的时候
我们可以通过标签来实现 当然在href里面需要指定 
每个标签都可以添加一个id属性,我们在进行跳转到指定位置的时候可以在#后面添加该id
该跳转是没有动画效果的,是直接跳转到该位置,如果需要动画则不行

锚点调整 需要给标签进行绑定一个id



也可跳转到一个新的界面指定的锚点
如
跳转到下个界面的指定位置
和上面方法类似 不过需要跟上指定界面标签的id
列表标签
1、什么是列表标签
    - 列表标签的作用:给一堆数据添加列表语义,也就是告诉搜索引擎告诉浏览器这一堆数据是一个整体
2、HTML中列表标签的分类
    - 无序列表 (使用最多)
    - 有序列表 (最少)
    - 定义列表 (其次)
3、无序列表作用
    - 给一堆数据添加列表语义。并且这一堆数据中所有的数据都没有先后之分
4、无序列表格式,
  • 是一个整体,是一个组合,不会单独出现,也不会单独使用 当然
  • 标签中会很复杂,也可以继续嵌套
      • 内容
      5、无序列表应用场景 - 商城列表 - 导航栏 - 新闻列表 - .....还有很多 6、有序列表
      1. a
      2. b
      3. c
      4. d
      5. e
      6. f
      用法和无序列表一模一样,只是会默认在列表前面加上数字,表示顺序 7、自定义列表 语法如下:
      定义列表中的标题
      定义列表中的描述
表格标签

格式

    
1 2 3
4 5 6
其中 tr代表整个表格中的一行数据,td代表表格中一行的一个单元格 内边距为文字和边框直接的间距 注意:表格标签默认有一个边框属性(border),默认为0,所以看不到边框,和列表标签一样,里面的tr,td不单独出现

综合使用 可以作为

的标题 放在
标签内部,默认居中显示,将其中的
属性换成属性,则默认字体为加粗和居中,可以理解为是用来存储列表的数据,存储列表的标题


    

排行榜

排名 关键词 趋势 今日搜索 最近七日 相关链接
1 暴走大事件 火热 555555 7878787 贴吧 贴吧 贴吧
1 暴走大事件 火热 555555 7878787 贴吧 贴吧 贴吧
1 暴走大事件 火热 555555 7878787 贴吧 贴吧 贴吧
1 暴走大事件 火热 555555 7878787 贴吧 贴吧 贴吧
1 暴走大事件 火热 555555 7878787 贴吧 贴吧 贴吧

效果如下


1546415539365.jpg

完整格式

    
信息
年龄
12
16

单元格合并

结果如下


1547719092565.jpg

你可能感兴趣的:(H5关于标签的那些事)