图像标签

图像标签为 <img> ,它是行内元素,其主要功能是在网页里面插入图像,所插入图片由属性 scr 属性决定。主要格式为 <img scr="URL"> ,其中 scr 属性是必要的。

另外其还有以下的属性:

属性 功能
width 指定图像的显示宽度
height 指定图像的显示高度
hspace 定义图像左侧和右侧的空白
vspace 定义图像顶部和底部的空白
align 指定图片的对齐方式
borber 指定图片的边框大小
alt 如果图片无法显示,代替图像的说明文字

设置图像的宽度和高度

<img scr="URL" width="" height=""> ,其中 width 和 height 的单位可以是像素,也可以是百分比,百分比表示图像为浏览器窗口大小的百分比。另外,只设置其中的一个,则另一根据已设置的属性按原图等比显示。

设置图像水平间距和垂直间距

<img scr="" hspace="">

<img scr="" vspace="">

设置图像的提示信息与边框

<img scr="URL" border="">

border 的值用数值,默认单位px。而在一般情况下,图像默认没有边框。另外,图片边框的颜色不可调整,默认为黑色,当图片作为超链接使用时,图片边框的颜色和文字超链接的颜色一致,默认为深蓝色。

<img scr="URl" alt=""> 用于对图片信息进行描述。

设置图像的对齐方式

<img scr="URL" align=""> 与其他元素不同的是图像的align属性既包括水平对齐方式,也包括垂直对齐方式。默认值为bottom。

超链接

普通链接

<a href="URL" title="提示文字" target="窗口名称">超链接名称</a>

href :定义了这个链接所指的目标地址,也就是路径。

title :给链接添加提示信息。

target :指定链接的目标窗口,有4个值:

  • _blank :在新窗口中打开被链接文档;
  • _self :默认,在相同的框架中打开被链接文档;
  • _parent :在父框架集中打开被链接文档;
  • _top :在整个窗口中打开被链接文档。

书签链接

(1)在同一个页面内使用书签链接:

<a href="#书签名称" target="窗口名称">链接标题</a>

(2)在不同页面使用书签链接:

<a href="URL地址#书签名称" target="窗口名称">链接标题</a>

两者链接到的目标为:

<a name="书签名称">链接内容</a>

电子邮件链接

<a href="mailto:E-mail地址[?subject=邮件主题&[参数=参数值]]">链接内容</a>

说明 :

(1)电子邮件链接的功能只有在浏览器端正确安装了电子邮件软件时才能正确运行;

(2)mailto:表示电子邮件链接的属性,其后跟具体的电子邮件地址;

(3)可以添加多个参数,当然必须用“&”来进行分割;

(4)多个邮件地址用“;”隔开;

(5)需要用“%20”来代替空白;

参数 说明
subject 电子邮件主题
cc 抄送收件人
bcc 暗送收件人,收件人和抄送人看不到暗送人
body 邮件内容

带主题的邮件链接:

<a href="mailto:email@address.com?subject=Hello">链接内容</a>

带多个参数的邮件链接:

<a href="mailto:email@address.com?subject=Hello &cc=abc@address.com&bcc=bca.com@">链接内容</a>

有多个收件人的邮件链接:

<a href="mailto:email@address.com;aa@addression.com?subject=Hello &cc=abc@address.com&bcc=bca.com@">链接内容</a>

FTP链接

FTP是一种文件传输协议,它是计算机与计算机之间能够互相通信的语言,通过FTP可以在Internet上获得丰富的资源。

<a href="ftp:/.../">链接内容</a>

下载文件的链接

只需要在链接地址处输入文件所在的位置即可。

<a href="URL">链接内容</a> 

HTML之超链接的更多相关文章

  1. jsp中超链接路径的写法

    主题 超链接不就是一个地址字符串吗?这能有什么花头? LZSB! 曾经我也是这么想的.... 最近对apache的学习让我对网页中超链接,CSS,js的路径的写法有了一些新的认识. 所以这篇文章主要分 ...

  2. 【Swift】UITableViewCell 中 TTTAttributedLabel 超链接无法点击的问题

    前言 还以为是自己代码写的有问题,用法和别的地方都一样,但是这个是在 UITableViewCell 中使用,另外在 tableHeaderView 中使用也没用这个问题 —— 使用 TTTAttri ...

  3. jQuery超链接提示,提示跟随鼠标动

    功能:实现鼠标移动到一个超链接时,鼠标右下角产生一个提示,并跟谁鼠标移动,知道鼠标离开超链接. 效果: 源码: <!--本案例是鼠标放在超链接上时,鼠标旁边有提示这是个超练级,以及放在图片上时图 ...

  4. HTML颜色、超链接设置

    <html> <head> <title>显示的页面选项卡标题</title> <style type="text/css"& ...

  5. html中的a标签(超链接)的使用

    a标签即超链接,用于从一张页面链接到另一张页面.其最重要的属性是href属性,它指示链接的目标. 例如: <a href="http://www.baidu.com/"> ...

  6. struts2实现改变超链接的显示方式

    问题来源:我们看别人家专业的网站的时候,会发现他们的超链接都是这样的http://www.cnblogs.com/ivictor/p/5522383.html 这是一个连接到某一篇文章的超链接,我们一 ...

  7. 用超链接提交表单,实现在动态网页的url中隐藏参数

    动态网页中怎么隐藏url参数传递 我们在做动态网站的时候往往会在各个页面之间传递参数,而这些参数的名称和值都会在url地址栏中被暴露出来,这样一方面不安全,另一方面也不便于搜索引擎的收录,有的时候还有 ...

  8. Ext.Net 学习随笔 003 超链接按钮

    HyperlinkButton() 1.不带图标的普通超链接按钮 @(X.HyperlinkButton() .Text("简单样式") .OnClientClick(" ...

  9. mvc中Url.RouteUrl或者Html.RouteLink实现灵活超链接,使href的值随路由名称或配置的改变而改变[bubuko.com]

    mvc,超链接除了直接写在a标签的href内还可以使用路由规则来生成,这样在改变了路由规则或者路由名称时不用再去代码中更改href的值,而且还容易遗漏.借助Url.RouteUrl或者Html.Rou ...

  10. 超链接实现post方式提交

    思路:如果想要超链接实现post方式提交,必须借助表单.下面得两种方式,一种是借助显示的form表单,一种是借助隐式的form表单方式一:将超链接放到一个form表单中,或者超链接本身就在一个form ...

随机推荐

  1. Python并发编程之消息队列补充及如何创建线程池(六)

    大家好,并发编程 进入第六篇. 在第四章,讲消息通信时,我们学到了Queue消息队列的一些基本使用.昨天我在准备如何创建线程池这一章节的时候,发现对Queue消息队列的讲解有一些遗漏的知识点,而这些知 ...

  2. C#在截屏时将截屏之前需要隐藏的控件也截入

    最近我在项目中遇到一个让我十分头疼的问题,就是我在截屏时也将截屏之前隐藏的控件也截入了. 情况:我在Winform窗体有个截屏功能按钮,实现在调用WPF全屏后截屏,但在截屏WPF界面前将界面里的一个L ...

  3. DOM编程以及domReady加载的几种方式

    1,关于DOM编程       DOM编程主要是对dom树节点进行操作,所以你必须掌握基本的节点类型,如何去获取节点名字以及值(这些相关知识你可以去网上查,这里推荐一个慕课学习网站->https ...

  4. Python开发爬虫之静态网页抓取篇:爬取“豆瓣电影 Top 250”电影数据

    所谓静态页面是指纯粹的HTML格式的页面,这样的页面在浏览器中展示的内容都在HTML源码中. 目标:爬取豆瓣电影TOP250的所有电影名称,网址为:https://movie.douban.com/t ...

  5. Python枚举类

    Enum可以把一组相关常量定义在一个class中,且class不可变,而且成员可以直接比较. 定义枚举类: from enum import Enum, unique @unique class We ...

  6. DVWA 黑客攻防演练(九) SQL 盲注 SQL Injection (Blind)

    上一篇文章谈及了 dvwa 中的SQL注入攻击,而这篇和上一篇内容很像,都是关于SQL注入攻击.和上一篇相比,上一篇的注入成功就马上得到所有用户的信息,这部分页面上不会返回一些很明显的信息供你调试,就 ...

  7. js判断时间是否超过了16:30

    // 判断时间是否超过了16:30 // true: 已超时 // false: 未超时 function timeCompare() { var now = new Date(); var nowT ...

  8. JS时间的获取及格式

    最近在做一个web聊天室,一个时间的问题挡住了进程,只好全网大搜索,将实用的方法记录下来,以备后查 <script src="/static/bootstrap/js/jquery.m ...

  9. js学习之路3: 数据类型

    1. 字符串: <!DOCTYPE html> <html> <body> <script> var apple = "苹果"; v ...

  10. Chinese word segment based on character representation learning 论文笔记

    论文名和编号 摘要/引言 相关背景和工作 论文方法/模型 实验(数据集)及 分析(一些具体数据) 未来工作/不足 是否有源码 问题 原因 解决思路 优势 基于表示学习的中文分词 编号:1001-908 ...