前端之路:Day 2

Day 2

1、meta name=“viewport” content=“width=device-width, initial-scale=1.0”>正常显示的前提

2、HTML文本标签

(1)h1~h6标签

特征:充满正行,并且有换行,具有与p标签一样的特征

(2)span标签

特征:不换行块级元素具有的特征就是独占一行,行内元素具有的特征就是允许多个行内元素同存一行。
因为:标签类型不一样:span标签为行内标签、h和p标签为块级标签。
注意:
p标签上下有一个空行,那不是由于块级元素导致,而是段落本身赋予的特征导致。
标签的三种基本类型:
块级标签(div,p,article,section等),行内标签(span),行内块标签(img)
通过css强行改变标签元素的类型:
Dsplay : block/inline-block/inline

(3)文章标签article

此标签用定义独立的文章或者文档

(4)文章中的节标签section

section标签定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。与article不同的是,该标签具有一个属性“cite”该属性的值为一个“url”,用于指出该段话摘自于哪一个网站,不过现在版本的浏览器并不支持该属性,但现在至少也可作为版权纠纷时的一个说明凭证。

(5)src属性

“src”是图片的必要属性,通过将该属性的值设置为 【硬盘或服务器地址上图片的绝对路径】 或 【HTML页面和图片间的相对路径】即可显示指定图片。

(6)ALT属性

由于网络的不稳定、部分用户的带宽较小或图片体积较大等原因,有的时候网页上的图片不能马上显示出来(路径错误会导致图片不能显示)这个时候就需要用到标签内的“alt”属性,只需将“alt”的属性值设为需要提示的文本信息即可。

(6)title属性

对图片进行一定的简单描述

(7)a标签

超链接默认情况是一个“行内标签”,即在他的上下方不会出现换行。
新窗口打开:target="_blank"
在当前浏览器窗口打开页面或文件:target="_self"
下载:
a标签除了能跳转到页面、文件,跳转页面位置,在HTML5中还能够定义一个文件的下载,并设置下载文件的名字。要具有这个功能,我们需给它加上“download”属性,并指定一个文件下载后的名称。
虽然类型很多,但是对他就两种情况
1、当前浏览器能识别的类型(比如:网站地址、图片地址、txt文档地址)
2、当前浏览器能识别的类型(比如:zip\ppt\doc\excel…) 就直接下载。
锚点链接:
如果将a标签的“href”属性值设置为“#”+“当前页面中指定元素的ID值”后,该超链接将不再是进行页面间的跳转或是文件的打开了, 而是将页面滚动到本页面中ID属性值和“href”属性值“#”后的值所对应的值的地方,同时页面滚动的目标元素的上边缘将和浏览器内容窗口上边缘重合。
回到顶部:
我们在一个内容很多的网页中加上a标签,并且他的href属性赋值为#top,那么当我们点击这个超链接时可以让当前网页回到最顶部。
2. 若网页中使用了这种方式让页面回到顶部的话,当前页面的所有元素都要避免使用“top”这个id值,否则该功能会失效.
Href的值为特殊值时
href=“https://www.baidu.com/” target="_blank" 时,href为正常百度地址 ;
没有href,如同一个span标签,表示普通文本 ;
href="#“时, #号(描点链接相关) 不跳转页面,会污染网页地址,不建议使用;
href=”"时,空字符串(会刷新) ;
href="javascript:void()"时, void(会执行js代码,返回空,什么都不做) void *则为“无类型指针”,void *可以指向任何类型的数据。地址不会出现#,也不会实现跳转。
href=“javascript:alert(666)”> alert(666),(会执行js代码,弹框) 。
O__O "…学写博客的第二天,呃…写的好丑,哈哈哈~~~~~~~~~~

猜你喜欢

转载自blog.csdn.net/weixin_43748812/article/details/84329313