HTML入门教程2

HTML学习day2:


学习内容:

一、 图像标签

功能

该标签可以在页面内按要求插入一张图片

     		<img src="path" alt="text" title="text" width="X" height="Y">

示例:

     		<img 
		      src="img.jpg" 
		      alt="图片丢失" 
		      title="img" 
		      width="1920"
		      height="80%"/>

src=“img.jpg”       // 图片路径     …/可以在上一级目录中搜索
alt=“图片丢失”       //图片加载失败时显示的信息
title=“img”      //鼠标悬停时显示的信息
width=“1920”      //指定图片的分辨率(可以不写 " " ),
height=“80%”       //用百分比表示,前面宽度确定后,后面高度在前面的基础上做百分比调整,单独用百分比是在显示器分辨率上做调整

1.其中src路径可分为绝对路径与相对路径,绝对路径会把文件确定的路径地址写出,一般使用相对路径(使用文件夹范围搜索)。
2.图片的分辨率如果只是单一标注,则另一分辨率则随比例改变。


二、 链接标签

功能

该标签可以将文本或图片变成一个跳转按钮,实现页面跳转功能

     		<a href="页面地址" target="目标窗口位置"> 链接相关的文本或图像 </a>

href=“页面地址”       // 页面地址可以是网址,也可以是本地文件地址
target="_blank"      //表示在新的一个空白页面打开
target="_self"      //表示在原有页面上打开

1、 文本超链接

     		<a href="path" target="目标窗口的位置"> 链接相关的文本 </a>

2、 图像超链接

     		<a href="https://www.blizzard.com/zh-tw/" target="_blank"> 
               <img 
		         src="img.jpg" 
		         alt="图片丢失" 
		         title="img" 
		         width="1920"
		         height="80%"/> 
            </a>

此功能实现为点击一张名为img.jpg的图片,则会自动跳转至暴雪游戏官网。


3、 锚链接

功能

1.从A页面的甲位置跳转到本页中的乙位置
2.从A页面的甲位置跳转到B页面中的乙位置

语法

1.先创建B页面目标target

            <a name="定位位置"> B页面中的乙位置标识名称 </a>

2.在创建A页面跳转命令页面

     	    <a href="B页面地址#定位位置"> A页面中乙位置的代称 </a>

猜你喜欢

转载自blog.csdn.net/balalaxstar/article/details/111567990