HTML(基础、链接标签、图片标签)

2022-05-12 21:18:52 浏览数 (2)

目录:

代码语义化 html基本格式 使用代码 a链接 img图片标签

代码语义化

1. 块状元素:独占一行,可以改变它的宽度和高度。如:标签 <div><p><h1>等等标签。

2. 内联元素:和块状元素相反,它不是独占一行,可以和其他元素放在一行;但是不能改变它的高度和宽度。如:标签<a><b><span>等。

3. HTML在web前端中作为骨架的作用;UTF-8声明浏览器编码,是为防止乱码。

基本格式:

自动跳转:

代码语言:javascript复制
<meta http-equiv="refresh" content="5;url=http://www.baidu.com"/>
<!--自动刷新,五秒后跳转到百度-->

实用代码

一些常用的代码

代码语言:javascript复制
<em>…</em> //斜体
<hr/> //水平线
<br/> //换行
<!--注释内容--> //注释
&nbsp; //空格
&copy; //版权符
&gt; //大于号(>)
&lt; //小于号(<)
&quot; //引号(")

a链接

当点击网页中的某一元素时,实现跳转或者锚链接功能。

代码实例:

代码语言:javascript复制
<a href="http://www.taobao.com" target="_blank">淘宝</a>

详解:

href

后跟需要跳转的链接,上面实例中是淘宝的网址,所以当点击网页中显示的淘宝字样后会跳转至淘宝官网。

target

声明打开的网页是在当前页面加载还是在浏览器中另外打开一个页面。

另外

需要注意a链接是一个双标签,是需要结束标签的。

img图片

作用:向网页中插入图片。

代码实例:

代码语言:javascript复制
<img src="图片地址" width="宽度" height="高度" title="这是图片"/>

详解

src

后跟图片所在地址,可以是链接地址,也可以是本地地址。这是图片的必须属性。

title

当鼠标悬浮在图片上方时会提示的文字。这不是图片标签的必须属性。

width & height

声明图片的宽度,这不是图片标签的必须属性,也可以在CSS中声明。

另外

img标签是一个单标签,不需要结束标签。

0 人点赞