web前端html5+css3学习笔记(4)——超链接、列表

文章目录

目录

一、超链接

1.跳转到页面

2.跳转到文件

3.跳转到锚点

4.唤起指定应用

二、列表

1.有序列表

2.无序列表

3.定义列表

总结


一、超链接

去京东

target: 控制跳转时如何打开页面

        _self :在本窗口打开(默认值)

        _blank :在新窗口打开

id : 元素的唯一 标识,可用于设置锚点

name : 元素的名字,写在 a 标签中,也能设置锚点 

1.跳转到页面

可以跳转到其他网页或者本地网页

代码中的多个空格、多个回车,都会被浏览器解析成一个空格

虽然 a 是行内元素但 a 元素可以包裹除它自身外的任何元素

2.跳转到文件

若浏览器无法打开文件,则会引导用户下载。我们也可以靠download属性强制触发下载,属性值是下载文件的名称


下载电影

3.跳转到锚点

两种方法:(推荐用第二种)




我是一个位置

去test1锚点 回到顶部 去demo.html页面的test1锚点 刷新本页面 点我弹窗

具有 href 属性的 a 标签是超链接具有 name 属性的 a 标签是锚点

name 和 id 都是区分大小写的,且 id 最好别以数字开头

注意跳转锚点必须要加上#,可以跳转到其他页面文件的锚点,也可以执行JS代码

4.唤起指定应用

可以唤起设备应用程序


电话联系

邮件联系

短信联系

超文本中的超字是超链接

超文本是一种组织信息的方式,通过超链接将不同空间的文字、图片等各种信息组织在一起,能从当前阅读的内容,跳转到超链接所指向的内容(页面、文件、锚点、应用)。

二、列表

1.有序列表

ordered list

       
  1. 是列表项

    1. 把冰箱门打开
    2. 把大象放进去
    3. 把冰箱门关上

    2.无序列表

    unordered list

      • 上海
      • 西安
      • 武汉

      3.定义列表

      definition list

          一个
      是一个术语名称,一个
      是术语描述(可以有多个)

      做好笔记
      笔记是我们以后复习的一个抓手
      笔记可以是电子版,也可以是纸质版
      多加练习
      只有敲出来的代码,才是自己的
      别怕出错
      错很正常的,改正后并记住,就是经验

      列表可以嵌套,下面用span包裹了

      • 成都
      • 上海
      • 西安
      • 武汉

    • 标签最好写在
          中,不要单独使用

          ctrl+shift+delete:在浏览器中清除缓存

          shift+tab:vscode代码整体左挪


          总结

          本篇学习超链接标签,可以更深刻理解超文本的内在含义,超链接标签可以实现四种功能;列表有三种分类。

          根据尚硅谷张天禹老师2023年的前端基础视频整理而成。

你可能感兴趣的:(前端,css3,html5,css,html)