前端语言基础篇之【常用标签详解】

最新推荐文章于 2020-07-29 12:29:07 发布

weixin_30947043

最新推荐文章于 2020-07-29 12:29:07 发布

阅读量90

点赞数

原文链接：http://www.cnblogs.com/chongzixing/p/5779641.html

版权

前端语言零基础 — 常用标签

html 是一种超文本标记语言极为标记语言而非编程语言，主要由标记标签组成，所以熟悉常用的标签是十分必要的下列介绍标记标签的特点及常用的标记标签.

HTML 标签是由尖括号包围的关键词，比如 <html>
HTML 标签通常是成对出现的，比如 <b> 和 </b>
标签对中的第一个标签是开始标签，第二个标签是结束标签
开始和结束标签也被称为开放标签和闭合标签

img标签

alt是图片的名字，是给百度搜索引擎抓取使用；

<html>
<head>.....</head>
<body>
<div>块<div>
<img src="n.png" alt=“鱼”>
</body>
</html>

a 标签：链接、下载、锚点
1、a标签链接具体网页地址

<a href="http. 具体网页地址> 标签名称 </a>

2、a标签定义链接打开方式

<base target="_black"/>

3、a标签的下载作用

<a href ="图片ppt背景.ppt"> 下载 </a>

4、a标签跳转至本网页

<a href="#“> 跳转至本网页 </a>

常用标签

div 块
img 图片（单标签）
a 链接、下载、锚点
h1-h6 标题
p 段落
strong 强调(粗体）
em 强调(斜体）
span 区分样式
ul 无序列表
ol 有序列表
li 列表项
dl 定义列表
dt 定义列表标题
dd 定义列表项

常用列表项举例

有序列表

<ol>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
</ol>
效果：
1. 列表项
2. 列表项
3. 列表项
4. 列表项

无序列表项

<ul>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
</ul>
效果：

列表项
列表项
列表项

选择符

id选择符（#）
群组选择符（，）
class选择符（.）
类型选择符（div....）
包含选择符( div p)
通配符（* ）

A的四个伪类

伪类：伪类用于被选中的元素添加特殊的效果。比如设置来a标签的特殊表现。

link 未访问（默认）
hover 鼠标悬停（鼠标滑过）
active 链接激活（鼠标按下）
visited 访问过后（点击过后）

A的四个伪类的顺序

link visited hover active

(love hate 记忆方法）

代码案例

 <style>
a:link{ font-size:60px; text-decoration: none; color: green; background; 2.png;}
a:hover{color: red;}
a:active{color:yellow;}
a:visited{color:black;}
</style>

转载于:https://www.cnblogs.com/chongzixing/p/5779641.html

weixin_30947043

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
前端语言基础篇之【常用标签详解】

前端语言零基础 — 常用标签 html 是一种超文本标记语言极为标记语言而非编程语言，主要由标记标签组成，所以熟悉常用的标签是十分必要的下列介绍标记标签的特点及常用的标记标签.HTML 标签是由尖括号包围的关键词，比如 <html>HTML 标签通常是成对出现的，比如 <b> 和 </b>标签对中的第一个标签是开始标签，第二...
复制链接

扫一扫