web前端学习笔记（常见HTML标签、图像和链接、语义化、CSS入门）

一、超链接标签

1、超链接的作用

可以点击文字、图片或者整个模块实现页面跳转功能，可以使多个页面之间产生一定的关联

2、语法

<a href="" title="" target="">需要点击的文字</a>

href属性 需要跳转的地址
title属性 鼠标悬停时显示的提示信息
target属性 规定打开方式
_self 在自己当前窗口打开（默认值）
_blank 新建一个空白窗口打开（推荐设置新窗口打开）

3、特性

超链接是行级标签
横向排列（元素与元素之间有间隙）
默认情况下，宽高自适应的
默认情况下，a标签中的内容自带下划线和文字颜色
默认情况下，鼠标悬停时显示手型
注意：a标签中可以嵌套文字、图片或者整个模块（但是不要嵌套自己）

4、应用

（1）跳转页面
（2）锚点链接

• 当前页面 定义锚点

定义锚点

<p id="p1"></p>

使用锚点

<a href="#p1"></a>

• 其他页面

定义锚点

<p id="p1"></p>

使用锚点

<a href="找到跳转的页面地址#p1"></a>

（3）下载

<a href="./1.rar">下载的a标签</a>

二、列表标签

列表主要用于比较规整和整齐清晰的一些布局中

1、无序列表

<ul>
	<li>列表项1</li> 
	<li>列表项2</li> 
	<li>列表项3</li>
	 ...... 
</ul>

ul标签是用来定义无序列表的
li标签用来定义列表项
ul自带间距，li自带列表符（实心圆点）
没有顺序之分的列表

<h3>前端三大组成部分</h3>

<!-- 无序列表 --> 
<ul>
	<!-- circle 空心圆 --> 
	<li style="list-style-type: circle;">HTML</li> 
	<!-- disc 实心圆（默认） -->