web前端基础知识——HTML常用标签篇

各种快捷键的使用方法:

多行注释  快捷键  ctrl +/
复制当前行到下一行   ctrl+d
标签的快捷写法  标签字母 +  tab键
网页格式化  快捷键  ctrl + alt +d +l

一、何为HTML?

html是超文本标记语言,作用是描述网页一种语言
html不是编程语言是标记语言。
html文档也叫web页面

二、HTML常用标签的学习:

head标签  头标签     
title标签 显示在网页的选项卡区域
body标签  显示网页的所有内容
meta标签  信息标签  charset=utf-8    meta 标签在head里面
标注当前网页的编码格式  utf-8   

1、标题标签  :

通过h1-h6定义的,作用:文本加粗,1-6字体,大小:由大到小。

代码如图:

 
  

网页效果图:

2、hr标签  :

水平线标签 代码如图:

网页效果如图:

3、段落标签


p : 将文本分割为段落  换行  属性   align=center  文本居中  right  文本靠右   left  靠左  默认是left(注意在代码页中按空格在网页中是无效的)

代码如图:

网页效果如图:

4、br标签:

强制换行标签 代码如图:

网页效果图:

5、文本格式化标签:

  • i标签  斜体
  • b标签   加粗
  • u标签   添加下滑线
  • sub  下标标签
  • sup   上标标签
  • em   斜体标签  和  i一致
  • small  小号字
  • strong  加粗  和 b  一致
  • del  添加删除线

代码如图:

网页效果图:

 

6、链接:

a标签 超文本链接跳转页面的
href  里面写的是跳转的地址  相对路径  和  绝对路径    远程路径
href  默认写#  代表跳转当前页面
<a href=""></a>
属性:target   target="_self"  在当前网页里面打开   target="_blank"  重新打开一个选项卡
默认是在当前网页里面打开
eg:点击a链接打开当前项目的网页  使用相对路径来做(相对于当前文件的位置)
绝对路径是文件所在盘符的目录     
网页从服务端打开里面路径不能写绝对路径很容易造成文件的丢失(不用绝对路径来写)
相对路径是绝对路径的一部分
远程路径就是相对路径  只不过把项目放到远程的服务器上面  通过远程服务器来访问的路径                                                                      

代码如图:

这里我用的是百度的网址。

网页效果如图:

这里可以点击一下百度这两个字就可以跳转到百度页面。

  • 同级之间的跳转(这里我们可以看到test1.html和超链接.html都在同一个文件夹下.在这儿之前我们在test1.html页面里写一个我在这儿)

       代码图:

网页效果图:

  • 不同级之间的跳转(这里我们可以看到勾选出来的两个页面在不同的文件夹下,在这儿之前同样在test.html写下你好)

代码图:

网页效果图:

  • 使用a链接制作锚标记

同级页面锚标记

然后输入n个br标签(不懂br什么意思的可以看下前面)输入br完全是为了明显。

然后在本页后面加一个这个就可以了。

不同级页面锚标记(和同级一样,只不过是加几个.)(.的含义不清楚的上方也介绍过了,这里就不介绍了)

这里注意书写格式。

然后在你想跳转的那个页面加一个这个就好了(注意id后面的一定要与你前面设置的一样啊)

 

 

 

 
 
发布了3 篇原创文章 · 获赞 1 · 访问量 83

猜你喜欢

转载自blog.csdn.net/weixin_46910841/article/details/105465801