<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<!--图像标签
<img src='图片的地址' alt='当图片显示不出来时所替换的文字'
title="当鼠标放到图片上显示的文字"
1、路径:绝对路径：F：\讲义\HTML\20180201
2、相对路径：
/:代表window盘符，根路径（下级目录）
./:当前目录（又叫文件夹） 同级目录(可省略不写)
../:上一级目录
超链接标签:
<a href="你要连接的地址" target="连接的打开方式">
title="当鼠标放上去时显示的文字"
</a>
href:相对路径、绝对路径、网络路径
target:_blank 在新窗口页打开
_self 在当前页跳转(默认)
超链接的下载功能：
href:只能写网页无法解析的文件
只有网页无法解析，才提供下载功能
只有 .zip .rar压缩文件才能下载
锚点连接：
1.设置标记（锚点）
<a name="标记值"><a/>
2.设置连接（当我点连接就回到锚点）
<a href="路径+#标记值"><a/>
-->
</head>

<body>
<!--设置锚点-->
<a name="top">顶部</a> <br>
<img src="./img/1.jpg" alt="">
<img src="../../../img/2.jpg" alt="这是小金毛" title="你饿了/金毛给你送外卖">
<!--新的页面打开-->
<a href="../0611/day01.html" target="_blank" title="这是百度">百度</a>
<!--当前页面打开-->
<a href="../0611/day01.html" target="_self">百度</a>
<a href="./img.zip">下载</a>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a name="middle">中部</a>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<!--设置连接-->
<a href="#top">回到顶部</a>
</body>
</html>

img、a标签的使用的更多相关文章

  1. a标签点击跳转失效--IE6、7的奇葩bug

    一般运用a标签包含img去实现点击图片跳转的功能,这是前端经常要用到的东西. 今天遇到个神奇的bug:如果在img上再包裹一层div,而且div设置了width和height,则图片区域点击时,无任何 ...

  2. IE6、7下html标签间存在空白符，导致渲染后占用多余空白位置的原因及解决方法

    直接上图:原因:该div包含的内容是靠后台进行print操作,输出的.如果没有输出任何内容,浏览器会默认给该空白区域添加空白符.在IE6.7下,浏览器解析渲染时,会认为空白符也是占位置的,默认其具有字 ...

  3. 百度MIP页规范详解 —— canonical标签

    百度MIP的规范要求必须添加强制性标签canonical,不然MIP校验工具会报错: 强制性标签<link rel="/^(canonical)$/"> 缺失或错误 这 ...

  4. 【CSS进阶】伪元素的妙用--单标签之美

    最近在研读 <CSS SECRET>(CSS揭秘)这本大作,对 CSS 有了更深层次的理解,折腾了下面这个项目: CSS3奇思妙想 -- Demo (请用 Chrome 浏览器打开,非常值 ...

  5. TODO：Laravel 使用blade标签布局页面

    TODO:Laravel 使用blade标签布局页面 本文主要介绍Laravel的标签使用,统一布局页面.主要用到到标签有@yield,@ stack,@extends,@section,@stop, ...

  6. 最新 去掉 Chrome 新标签页的8个缩略图

    chrome的新标签页的8个缩略图实在让人不爽,网上找了一些去掉这个略缩图的方法,其中很多已经失效.不过其中一个插件虽然按照原来的方法已经不能用了,但是稍微变通一下仍然是可以用的(本方法于2017.1 ...

  7. css-父标签中的子标签默认位置

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  8. xpath提取多个标签下的text

    title: xpath提取多个标签下的text author: 青南 date: 2015-01-17 16:01:07 categories: [Python] tags: [xpath,Pyth ...

  9. 多个Img标签之间的间隙处理方法

    1.多个标签写在一行 <img src="/i/eg_tulip.jpg" alt="郁金香" height="100px"/> ...

  10. html5标签canvas函数drawImage使用方法

    html5中标签canvas,函数drawImage(): 使用drawImage()方法绘制图像.绘图环境提供了该方法的三个不同版本.参数传递三种形式: drawImage(image,x,y):在 ...

随机推荐

  1. ubuntu Change Language

    慎用 所謂的語系(locale),其實包含語言及地區的設定,因為除了語言之外,國家與國家的日期表示方式.數字格式.貨幣符號.度量單位可能都不一樣,所以才會有了這個locale的發明,依照國家和語言給予 ...

  2. VFL演示样例

    上篇文章向大家介绍了VFL的基本的语法点,假设对下面演示样例不熟的童鞋,能够前去參考.废话不多说.我们直接来看演示样例. 演示样例一 将五个大小同样.颜色不同的view排成一行,view间的间隔为15 ...

  3. easyui 后台框架搭建

    近期公司要搭建一个后台管理项目.因为美工缺少 选择使用easyui jquery 框架 仅仅要懂点html js 这个用起来不是难事,看过API.在网上看了些 将它们组装起来 进行改动.因为本人也是第 ...

  4. Google2015校招在线測试题1----扫雷最少点击次数

    Problem Minesweeper is a computer game that became popular in the 1980s, and is still included in so ...

  5. 行香子&#183;过尽千山

    <行香子·过尽千山> 文/天地尘埃2020 过尽千山.水瘦山寒. 思来路.地咽天玄. 千金散尽,欲补穹天. 但孟春暖,仲春炫.暮春喧. 三皇五帝,魏武挥鞭. 朴无欲.衡玉玑璿. 金生丽水, ...

  6. Python科学计算的瑞士军刀——Anaconda 安装与配置

    Introduce Python是一种强大的编程语言.其提供了非常多用于科学计算的模块,常见的包含numpy.scipy和matplotlib.要利用Python进行科学计算.就须要一一安装所需的模块 ...

  7. 500万url的es 批删除

    bash  循环 算术计算 读写文件 [root@hadoop2 ~]# sh looh.sh1234LIZ1 2 3 4 0 1 2 3 4 5 6 7 8 9 10 0games:x:12:100 ...

  8. openstack liberty aio nova 调试

  9. PCB 钻孔补偿那点事

    没有优秀的个人,只有优秀的团队,在团队共同的协作下,PCB CAM自动化[net处理]与[钻孔处理] 第一阶段开发项完成了,,后续工作可以转向PCB规则引擎开发了.这里说说PCB工程钻孔补偿的那点事, ...

  10. Euclid(几何)

    http://acm.sdut.edu.cn/sdutoj/problem.php?action=showproblem&problemid=2831 题意:已知A,B,C,D,E,F的坐标, ...