html图像、绝对路径和相对路径,链接
html图像
<img>标签可以在网页上插入一张图片,它是独立使用的标签,通过“src”属性定义图片的地址,通过“alt”属性定义图片加载失败时显示的文字,以及对搜索引擎和盲人读屏软件的支持。
<img src="images/pic.jpg" alt="产品图片" />
绝对路径和相对路径
像网页上插入图片这种外部文件,需要定义文件的引用地址,引用外部文件还包括引用外部样式表,javascript等等,引用地址分为绝对地址和相对地址。
绝对地址:相对于磁盘的位置去定位文件的地址
相对地址:相对于引用文件本身去定位被引用的文件地址
绝对地址在整体文件迁移时会因为磁盘和顶层目录的改变而找不到文件,相对路径就没有这个问题。相对路径的定义技巧:
“ ./ ” 表示当前文件所在目录下,比如:“./pic.jpg” 表示当前目录下的pic.jpg的图片,这个使用时可以省略。
“ ../ ” 表示当前文件所在目录下的上一级目录,比如:“../images/pic.jpg” 表示当前目录下的上一级目录下的images文件夹中的pic.jpg的图片。
html链接
<a>标签可以在网页上定义一个链接地址,通过src属性定义跳转的地址,通过title属性定义鼠标悬停时弹出的提示文字框。
<a href="#"></a> <!-- # 表示链接到页面顶部 -->
<a href="http://www.itcast.cn/" title="跳转的传智播客网站">传智播客</a>
<a href="2.html">测试页面2</a>
定义页面内滚动跳转
页面内定义了“id”或者“name”的元素,可以通过a标签链接到它的页面滚动位置,前提是页面要足够高,有滚动条,且元素不能在页面顶部,否则页面不会滚动。
<a href="#mao1">标题一</a>
......
......
<h3 id="mao1">跳转到的标题</h3>
html图像、绝对路径和相对路径,链接的更多相关文章
- href 里面 链接前面加/与不加的区别?(绝对路径与相对路径)
在写href链接时,有绝对路径与相对路径,href 里面 链接前面加/与不加的区别? href="/cp/images/lis.jpg" 相对路径 cp前面/会获取当前路径,组合成 ...
- Html图像标签、绝对路径和相对路径:
Html图像标签: <img>标签可以在网页上插入一张图片,它是独立使用的标签,它的常用属性有: (1)src 属性 定义图片的引用地址 (2)alt 属性 定义图片加载失败时显示的文字, ...
- linux基础进阶命令详解(输出重定向(2>&1,1>&2,&>file)、输入重定向、管道符、通配符、三种引号、软连接、硬链接、根“/”、绝对路径vs相对路径)
本章命令(共9个): 1 2 3 4 5 6 7 8 9 输出重定向 输入重定向 管道符 通配符 三种引号 软连接 硬链接 根"/" 绝对路径vs相对路径 1.输出重定向 作用:一 ...
- XHTML 相对路径与绝对路径
文件路径 文件路径就是文件在电脑(服务器)中的位置,表示文件路径的方式有两种:相对路径和绝对路径. 路径标识: 标识符号 说明 / 路径标识 . 当前目录 .. 上一层目录 "." ...
- Xcode 中的相对路径与绝对路径的相关设置
近日闲来无事,与博客园中闲荡,忽至一烟霞照耀祥瑞蒸熏松竹翠秀奇花遍开的神奇之地.如此美景,令人心生向往,故而徜徉于其中不可自拔,独乐乐不如众乐乐: iOS开发之 相对路径与绝对路径 https://d ...
- https/相对路径,绝对路径
1. htttps HTTPS(全称:Hyper Text Transfer Protocol over Secure Socket Layer),是以安全为目标的HTTP通道,简单讲是HTTP的安全 ...
- iOS开发之Xcode 相对路径与绝对路径
iOS开发之 相对路径与绝对路径 https://developer.apple.com/library/mac/documentation/DeveloperTools/Reference/Xcod ...
- Http,Https (SSL)的Url绝对路径,相对路径解决方案Security Switch 4.2 中文帮助文档 分类: ASP.NET 2014-10-28 14:09 177人阅读 评论(1) 收藏
下载地址1:https://securityswitch.googlecode.com/files/SecuritySwitch%20v4.2.0.0%20-%20Binary.zip 下载地址2:h ...
- jsp相对路径和绝对路径小谈
很长一段时间纠结过JSP中的相对路径和绝对路径,也研究过一段时间,今天趁着有点时间,记下来,也有大家分享一下. 1)我们先来理解一下相对路径 首先还是我们的开始,建一个WEB项目,只是测试一下而已,名 ...
随机推荐
- sqlserver笔记
表结构: 一,字段类型sqlserver jdbc java char char Stringnchar nchar Stringvarchar varchar Stringnvarchar nvar ...
- MySql数据库连接池专题
MySql数据库连接池专题 - aspirant - 博客园https://www.cnblogs.com/aspirant/p/6747238.html
- Drools 规则引擎
Drools - Drools - Business Rules Management System (Java™, Open Source) http://drools.org/ [Drools]J ...
- 初步了解HTTP
HTTP简介: HTTP:HyperText Transfer Protocol 超文本传输协议,是因特网上使用最为广泛的一种网络传输议,是用于从万维网(www :world wide web)服 ...
- Laravel Providers——服务提供者的注册与启动源码解析
本文 GitBook 地址: https://www.gitbook.com/book/leoyang90/laravel-source-analysishttps://learnku.com/a ...
- java.util(Date和Calendar)
public class Date implements java.io.Serializable, Cloneable, Comparable<Date> { public Date() ...
- mysql实现首字母从A-Z排序
1.常规排序ASC DESC ASC 正序 DESC倒叙 -- 此处不用多讲 2.自定义排序 自定义排序是根据自己想要的特定字符串(数字)顺序进行排序.主要是使用函数 FIELD(str,str1,s ...
- spring后置处理器BeanPostProcessor
BeanPostProcessor的作用是在调用初始化方法的前后添加一些逻辑,这里初始化方法是指在配置文件中配置init-method,或者实现了InitializingBean接口的afterPro ...
- java学习之—链表(2)
/** * 双端链表操作 * Create by Administrator * 2018/6/14 0014 * 下午 2:05 **/ class Link1 { public long dDat ...
- element-ui 源码解析 二
Carousel 走马灯源码解析 1. 基本原理:页面切换 页面切换使用的是 transform 2D 转换和 transition 过渡 可以看出是采用内联样式来实现的 举个栗子 <div : ...