首页 前端知识 HTML5总结分析 day02 part1

HTML5总结分析 day02 part1

2024-08-08 22:08:45 前端知识 前端哥 227 889 我要收藏

        在使用HTML5进行网页设计的时候如果不是特别明显的错误,系统基本上是不会报错的,但是为了代码的可读性 可维护性以及可移植性 其内容必须是符合标准的,在严格意义上不会有明确的对错.

HTML5常用标签

一.排版标签

1.标题标签(head 头部)  根据规定只有h1-h6是有效能的并且有着明显的显示差别,而6以上就不再具有字体上的变化了.            <head>...</head>                            作用:主要提供了关于这篇文档的信息

2.段落标签(paragraph  段落) 主要用于分段在显示上是一个个文本块,在段落之间会具有一定的间距.   <p></p>   在文本较多的情况下如新闻界面是比较常用的一种标签.

3.水平线标签(horizontal 水平线)  不是特别常用 主要用于段落和段落之间用于分隔,并且它也具有一定的属性,可以按喜好更改它的粗细以及颜色等,而它的特殊之处就是它是一个单标记.  <hr />

4.换行标签(break 打断) 也不算很常用,主要用于不希望内容显示在同一行时进行的强制换行时.同时它也和水平线标签</hr>一样 是占少数的单标记.

5*.div标签(division 分开) 是在html中使用最多的一种标签,作用是为文档内大块的内容提供结构

<div>块内容</div>   注意:div是块级元素,因此它的内容是独占一行的.

问:p标签可以嵌套div吗?   答案是定的,div标签可以嵌套任何标签,但是p标签不可以嵌套div.

6*.span标签(span 跨度) 作为文本的容器,可以通过使用span标签来进行对标签对象的一些美化操作.   注意:span标签是行内元素,也就是不管有多少个span标记同时出现,内容都显示在同一行.

二.文本格式化标签

主要包括四种分别是:加粗 斜体 下划线以及删除线.  每种都有着两种表示方式

加粗:<strong></strong> <b></b>   斜体:<em></em> <i></i>  

删除线:<del></del> <s></s>          下划线:<ins></ins>  <u></u> :只有靠前的表示方法符合语义化规定也是我们推荐使用的,可以起到加重语气的效果,而其他的缩写也可以实现目的但是并不规范.

三*.图像标签 (image 图像) 想要在网页当中显示图片就必须使用本标签!!! 使用本标签的基本语法格式是:<img src="图像URL(路径)"/>    img标签也具有属性,常用的属性有以下几个:src (图片位置路径) alt(替代性文本信息) width(图片的宽) height(图片的高度) title(当鼠标悬浮在图片上时显示的信息)   

关于引入图片时的路径问题*:    二者:图片文件所在位置    html文件所在位置

1.当二者处于同级目录下时只需输入图像文件的名称即可实现图片的引入.

2.当二者不处于同级目录下时 如果是下级则使用/符号分隔路径.

3.反之则使用../返回上一级目录 每上一层便使用一次.

四.链接标签(anchor 锚)

常用于在html文件当中对指定文本进行超链接的操作,其计本语法格式为<a href="跳转地址" target="目标窗口的弹出方式">    href属性的属性值是目标地址的URL路径,target属性的属性值有两个,分别是_self和_blank,当属性值为前者时表示跳转路径所指向的网页在原本的窗口显示,当属性值为后者是表示其路径所指向的网页在一个新的窗口中打开.

注意:链接方式主要有以下三种方式(图像 表格 音频等也可以进行超链接的添加操作)

1.外部链接 主要是一些网页的网址 比如 http://www.baidu.com

2.内部链接 指的是跳转到内部已建立的html页面文件.

3.当需要使用链接但是没明确地址是可以将属性值设置为#用于占位.

五.网页的icon图标(用于设置在页面名称前的小图标,默认是一个灰白色的地球图标)

使用link标签添加网页的icon图标 其基本的语法格式是:

<link rel="shortcut icon" href="http://example.com/favicon.ico" type="image/x-icon">

红色字体部分是用于在目标网址的根目录下获取其icon图标.网站的图标都是.icon格式的.

六.特殊字符  最常用的字符实体有   半角空格:&nbsp;    全角空格:&emsp;  商标:&copy;

HTML标签分类

1.双标签 一般是成对出现的,有开始标签和闭合标签构成 可以嵌套和承载内容,如<p>...</p>.

2.单标签

没有内容的标签,在开始标签中自动闭合如<br>和<hr>.

HTML标签关系

在html当中标签关系一般分成两种关系,分别是并列关系和嵌套关系

嵌套关系:如head标记当中一般会套用title,其表现形式就是title的开始标记要在head闭合标记的基础上使用tab键进行缩进,以此来凸显二者是嵌套关系.

并列关系,在层次结构上二者是同级的,如<dt></dt>和<dd></dd>,不存在tab缩进的关系,两者并列.

HTML标签的语义化

用一句话来讲就是:在合适的地方使用合适的标签,不要因为没有明显的对错就忽略代码的合理性.

效果:

1. 方便代码的阅读和维护

2. 同时让浏览器可以很好地解析,从而更好分析其中的内容

3. 使用语义化标签会具有更好地搜索引擎优化。

转载请注明出处或者链接地址:https://www.qianduange.cn//article/14989.html
标签
评论
发布的文章

前端-axios应用在html文件

2024-08-15 23:08:39

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!