Web网页设计入门基础知识点(2)

图片标签 img

<img> 单标签  src:图片路径——图片的具体位置

                        ati:图片描述

                        width:图片宽度，单位是像素    

                        height:图片高度，单位像素（px）

语法：<img src="图像来源"/>

属性名	属性值	说明
src	图片路径	必须属性
atl	文本	替换文本，图片不能显示时出现的文字
title	文本	提示文本。鼠标放到图像上显示文字
border	像素	设置图像的边框粗细

注意：标签名与属性之间必须用空格隔开，属性之间用空格隔开。

VS Code快捷操作：直接敲"../"后，会自动提示上级目录下有文件，直接选择即可。

链接标签

a 超链接   双标签

herf：指定要跳转到的具体目标。

target：控制跳转时如何打开页面。  常用值：  _self:在本窗口打开 (默认值是_self)

                                                                          _blank:在新窗口打开

id： 元素的唯一标识,可用于设置锚点。

name：元素名称，写在a标签中，能设置锚点。

语法：

<a herf="跳转目标" target="目标窗口的弹出方式">文本或图像</a>

跳转到空文档  <a herf="#">链接</a>

（重点）跳转到锚点    <a href="#id名">链接文本</a>

                                     找到目标位置标签，在里面添加一个id属性=id名。

例如:

<p><a href="#one">第一节</a></p>
<p><a href="#two">第二节</a></p>

<h3 id="one">第一节<h3>
文本内容
<h3 id="two">第二节<h3>
文本内容

布局标签 div和span

1.div标签

没有特定含义是作为做和其他HTML元素的容器。默认情况下，div标签将占满一行，当存在多个div标签时，将按照从上到下的方式排列。

<div>.....</div>

2.span标签

与div标签不同，在默认情况下，多个span标签可以存在于同一行，按从左到右的方式进行排列。

作用就是设置单独的样式。