Python Web全栈之旅02--Web前端●走入HTML的世界(中)
off999 2024-10-19 07:12 18 浏览 0 评论
一、a元素
HTML <a> 元素(或称锚元素)可以创建通向其他网页、文件、同一页面内的位置、电子邮件地址或任何其他 URL 的超链接。
1、 a链接分类:
● 普通链接
①举个栗子:
<a href = "https://www.toutiao.com"></a>
● 锚点
简单说:锚点用于页面内部定位。
①举个栗子:
Python大星正刷微博,现在Python大星想回到最顶层,该怎么做呢?
当你选择B选项时,其实你正在使用HTML锚点。
②一般是这样使用的:
● 功能链接
①举个栗子:
手机浏览某些网站,点击“客服电话”的图标,会触发电话功能。
②示例:
二、路径(地址)的写法
1、路径资源出处
● 站内资源
● 站外资源
这两者的区别,举个栗子:
Python大星在腾讯视频APP搜索《海贼王》时,页面提示“正在为您跳转第三方网站”。
《海贼王》的视频资源就是第站外资源。当Python大星搜索《哪吒之魔童降世》时,没有提示,直接播放,说明《哪吒之魔童降世》是站内资源。
2、地址分类
● 绝对路径
一般引用站外资源时使用
书写格式:
协议名://主机名:端口号/路径
schema://host:port/path
协议名:常用的有http,https,比如头条号主页用的https
主机名:域名或者ip地址,比如说头条的域名是mp.toutiao.com,或者百度39.156.66.14
端口号:一般网站不写也能访问。作为开发者,经常会接触8080端口
路径:相当资源文件目录
注意:
当跳转目标和当前页面的协议相同时,可以省略协议名
● 相对路径
一般引用站内资源时使用
① 当前资源所在的目录可以使用./
注意:当表示当前资源所在路径,./可以隐藏。
②可以书写../表示返回上一级目录
三、图片元素img
1、img基本用法
img 是imge的缩写,是空元素(查看上一篇解释)
有2个常用的属性:
src :source的缩写,表示图片资源路径
alt:当图片资源失效时,将使用该属性的文字替代图片
2、img元素与a元素的使用
<a href="/" class="logo"> <img src="//s3.pstatp.com/toutiao/static/img/logo.271e845.png" alt="今日头条" style="width: 108px; height: 27px;"> </a>
3、img元素与map元素的组合
举个栗子:
Python大星参加砸金蛋活动,点击其中一个金蛋,就会破碎弹出相应的奖品。
这就可以用到img和map的组合。
<area shape="circle" coords="180,139,14" href ="/example/html/venus.html" alt="Venus" />
解释:circle代表圆形区域,圆心x=180,y=139,半径r=14个像素
四、多媒体元素
1、多媒体元素分类
● video 视频
controls: 控制控件的显示,取值只能为controls
某些属性,只有两种状态:1. 不写 2. 取值为属性名,这种属性叫做布尔属性
布尔属性,在HTML5中,可以不用书写属性值
autoplay: 布尔属性,自动播放。
muted: 布尔属性,静音播放。
loop: 布尔属性,循环播放
● audio 音频
和视频完全一致
兼容性:
① 旧版本的浏览器不支持这两个元素
② 不同的浏览器支持的音视频格式可能不一致
mp4、webm
五、上一篇
>>>《Python Web全栈之旅01--Web前端●走入HTML的世界(上)》
相关推荐
- Python 数据分析——利用Pandas进行分组统计
-
话说天下大势,分久必合,合久必分。数据分析也是如此,我们经常要对数据进行分组与聚合,以对不同组的数据进行深入解读。本章将介绍如何利用Pandas中的GroupBy操作函数来完成数据的分组、聚合以及统计...
- python数据分析:介绍pandas库的数据类型Series和DataFrame
-
安装pandaspipinstallpandas-ihttps://mirrors.aliyun.com/pypi/simple/使用pandas直接导入即可importpandasas...
- 使用DataFrame计算两列的总和和最大值_[python]
-
【如果对您有用,请关注并转发,谢谢~~】最近在处理气象类相关数据的空间计算,在做综合性计算的时候,DataFrame针对每列的统计求和、最大值等较为方便,对某行的两列或多列数据进行求和与最大值等的简便...
- 8-Python内置函数
-
Python提供了丰富的内置函数,这些函数可以直接使用而无需导入任何模块。以下是一些常用的内置函数及其示例:1-print()1-1-说明输出指定的信息到控制台。1-2-例子2-len()2-1-说...
- Python中函数式编程函数: reduce()函数
-
Python中的reduce()函数是一个强大的工具,它通过连续地将指定的函数应用于序列(如列表)来对序列(如列表)执行累积操作。它是functools模块的一部分,这意味着您需要在使用它之...
- 万万没想到,除了香农计划,Python3.11竟还有这么多性能提升
-
众所周知,Python3.11版本带来了较大的性能提升,但是,它具体在哪些方面上得到了优化呢?除了著名的“香农计划”外,它还包含哪些与性能相关的优化呢?本文将带你一探究竟!作者:BeshrKay...
- 最全python3.11版12类75个内置函数大全
-
获取全部内置函数:importbuiltins#导入模块yc=[]#异常属性nc=[]#不可调用fn=[]#内置函数defll(ty=builtins):...
- 软件测试笔试题
-
测试工程师岗位,3-5年,10-14k1.我司有一款产品,类似TeamViewer,向日葵,mstsc,QQ远程控制产品,一个PC客户端产品,请设想一下测试要点。并写出2.写出常用的SQL语句8条,l...
- 备战各大互联网巨头公司招聘会,最全Python面试大全,共300题
-
前言众所周知,越是顶尖的互联网公司在面试这一part的要求就越高,需要你有很好的技术功底、项目经验、一份漂亮的简历,当然还有避免不了的笔试过关。对于Python的工程师来说,全面掌握好有关Python...
- 经典 SQL 数据库笔试题及答案整理
-
马上又是金三银四啦,有蛮多小伙伴在跳槽找工作,但对于年限稍短的软件测试工程师,难免会需要进行笔试,而在笔试中,基本都会碰到一道关于数据库的大题,今天这篇文章呢,就收录了下最近学员反馈上来的一些数据库笔...
- 用Python开发日常小软件,让生活与工作更高效!附实例代码
-
引言:Python如何让生活更轻松?在数字化时代,编程早已不是程序员的专属技能。Python凭借其简洁易学的特点,成为普通人提升效率、解决日常问题的得力工具。无论是自动化重复任务、处理数据,还是开发个...
- 太牛了!102个Python实战项目被我扒到了!建议收藏!
-
挖到宝了!整整102个Python实战项目合集,从基础语法到高阶应用全覆盖,附完整源码+数据集,手把手带你从代码小白变身实战大神!这波羊毛不薅真的亏到哭!超全项目库,学练一站式搞定这份资...
- Python中的并发编程
-
1.Python对并发编程的支持多线程:threading,利用CPU和IO可以同时执行的原理,让CPU不会干巴巴等待IO完成。多进程:multiprocessing,利用多核CPU...
- Python 也有内存泄漏?
-
1.背景前段时间接手了一个边缘视觉识别的项目,大功能已经开发的差不多了,主要是需要是优化一些性能问题。其中比较突出的内存泄漏的问题,而且不止一处,有些比较有代表性,可以总结一下。为了更好地可视化内存...
- python爬虫之多线程threading、多进程、协程aiohttp批量下载图片
-
一、单线程常规下载常规单线程执行脚本爬取壁纸图片,只爬取一页的图片。importdatetimeimportreimportrequestsfrombs4importBeautifu...
你 发表评论:
欢迎- 一周热门
-
-
python 3.8调用dll - Could not find module 错误的解决方法
-
加密Python源码方案 PyArmor(python项目源码加密)
-
Python3.8如何安装Numpy(python3.6安装numpy)
-
大学生机械制图搜题软件?7个受欢迎的搜题分享了
-
编写一个自动生成双色球号码的 Python 小脚本
-
免费男女身高在线计算器,身高计算公式
-
将python文件打包成exe程序,复制到每台电脑都可以运行
-
Python学习入门教程,字符串函数扩充详解
-
Python数据分析实战-使用replace方法模糊匹配替换某列的值
-
Python进度条显示方案(python2 进度条)
-
- 最近发表
- 标签列表
-
- python计时 (54)
- python安装路径 (54)
- python类型转换 (75)
- python进度条 (54)
- python的for循环 (56)
- python串口编程 (60)
- python写入txt (51)
- python读取文件夹下所有文件 (59)
- java调用python脚本 (56)
- python操作mysql数据库 (66)
- python字典增加键值对 (53)
- python获取列表的长度 (64)
- python接口 (63)
- python调用函数 (57)
- python qt (52)
- python人脸识别 (54)
- python斐波那契数列 (51)
- python多态 (60)
- python命令行参数 (53)
- python匿名函数 (59)
- python打印九九乘法表 (65)
- centos7安装python (53)
- python赋值 (62)
- python异常 (69)
- python元祖 (57)