signed

QiShunwang

“诚信为本、客户至上”

html基础学习笔记(一)

2021/5/14 22:08:26   来源:

一、盒子(布局用)

<div>独占一行</div>
<span>一行可以放多个(小盒子)</span>

在这里插入图片描述

二、图像路径(重点)

<img src=”图像URL” />
src是属于这个图像标签的特性
<h4>图像标签的使用:</h4>
<img src="123.jpg"/>
<h4>alt:替换文本 图像显示不出来的时候用文字提示:</h4>
<img src="12.jpg" alt="显示错误"/>
<h4>title提示文本鼠标放在图像上,提示文字</h4>
<img src="123.jpg" title="我是谁?"/>

<h4>width 给图像设定宽度:只是修改一个就可以,就等比缩放</h4>
	<img src="123.jpg" width="500" />
	<img src="123.jpg" height="100" />
	<h4>border 设定边框粗细</h4>
 <img src="123.jpg" width="500" border="15"/>

在这里插入图片描述

三、路径

(1)目录文件夹和根目录:

① 目录文件夹:普通文件夹,放html和图片;

② 根目录:打开目录文件夹的第一层就是根目录;

(2)路径:

③ 相对路径:

1)同一级路径src=”img.jpg”
2)下一级路径:src=”images/img.jpg”
3)上一级路径:src=”../img.jpg”

④ 绝对路径:

1)Src=”C:\web\img.jpg”(在电脑上的路径)
2)Src=”http://www.baidu.com” (完整的网络地址)

四、超链接(重点)

(1)语法格式

(2)链接分类(target=”_blank”)(target=”_self”)

①外部链接

在这里插入图片描述

②内部链接

在这里插入图片描述

③空链接

在这里插入图片描述

④下载文件链接

⑤图片元素链接

在这里插入图片描述

(3)锚点链接

 <a href="#life"></a>
<h3 id="life"></h3>

五、特殊字符

1.注释

CTRL+/

2.字符

在这里插入图片描述
在这里插入图片描述

<tr>为一行
<td>为一个单元格
<th>首行(单元格内容加粗)
align="center" 表格位置居中
cellpadding="0"字与边框的距离
cellspacing="0"单元格与单元格的距离

在这里插入图片描述

在这里插入图片描述

学习内容是看的传智播客的pink老师的前端教学。感谢pink老师。