码迷,mamicode.com
首页 > Web开发 > 详细

HTML标签

时间:2020-01-27 17:23:59      阅读:104      评论:0      收藏:0      [点我收藏+]

标签:rgb   名称   bmp   空白   段落   时代   分表   超文本标记语言   tom   

1.        HTML简介

1.1.        缩写HTML全称为HyperText Markup Language,译为超文本标记语言,它不是一种编程语言,而是一种描述性的标记语言,用于描述超文本中内容的显示方式。比如字体什么颜色,大小等。

1.2.        名词解释:

1.2.1.       超文本:音频,视频,图片称为超文本。

1.2.2.       标记 :<英文单词或者字母>称为标记,一个HTML页面都是由各种标记组成。

2.         HTML的网络术语

2.1.        标签:分为开始标签(如<P>)和结束标签(如</P>),每个标签都规定好了其特殊含义;

2.2.        属性:标签的特征分类;

2.3.        元素:标签所要修饰的内容;

3.         中文能正常显示的字符集有两种:

3.1.        第一种:UTF-8UTF-8是国际通用字库,里面涵盖了所有地球上所有人类的语言文字,比如阿拉伯文、汉语、鸟语……毫无疑问,开发中,都用UTF-8编码吧,准没错。

3.2.        第二种:GBK(对GB2312进行了扩展)。gb2312 是国标,是中国的字库,里面涵盖了汉字和一些常用外文,比如日文片假名,和常见的符号。

4.         HTML颜色表示:

4.1.        纯单词表示:red、green、blue、orange、gray等;

4.2.        10进制表示:RGB(255,0,0);

4.3.        16进制表示:#FF0011;

5.         HTML标签等级

5.1.        文本级标签:p、span、a、b、i、u、em。文本级标签里只能放文字、图片、表单元素。(a标签里不能放a和input)

5.2.        容器级标签:div、h系列、li、dt、dd。容器级标签里可以放置任何东西。

6.         HTML结构

6.1.        文档声明:<!DOCTYPE html>

6.2.        头标签<head>:包括<title>、<base>、<meta>、<link>

6.2.1.       <title>标签:指定整个网页的标题,在浏览器最上方显示;

6.2.2.       <base>标签:

6.2.3.       <meta>标签:有关页面的基本信息;有一个<meta>标签是需要记住的:<meta http-equiv="refresh" content="3;http://www.baidu.com">这个标签的意思是说,3秒之后,自动跳转到百度页面。

6.2.4.       <link>标签:定义文档与外部资源的关系;

6.3.        <body>标签

6.3.1.       <body>标签的属性

6.3.1.1.       bgcolor:设置整个网页的背景颜色;

6.3.1.2.       background:设置整个网页的背景图片;

6.3.1.3.       text:设置网页中的文本颜色;

6.3.1.4.       leftmargin:网页的左边距;

6.3.1.5.       rightmargin:网页的右边距;

6.3.1.6.       topmargin:网页的上边距;

6.3.1.7.       bottommargin:网页的下边距。

6.3.1.8.       link属性表示默认显示的颜色、alink属性表示鼠标点击但是还没有松开时的颜色、vlink属性表示点击完成之后显示的颜色。

6.3.2.       <body>标签的子标签(排版标签)

6.3.2.1.       注释标签:<!-- 注释 -->

6.3.2.2.       段落标签<p>:属性align(对齐方式), <p>标签会在段落的前后自动插入一个空行。

6.3.3.       块级标签:<div>和<span>,这两个都是最最重要的“盒子,是非常重要的标签,div的语义是division“分割”; span的语义就是span“范围、跨度”。 两个元素是专门为定义CSS样式而生的。<span><div>唯一的区别在于<span>是不换行的,而<div>是换行的。

6.3.3.1.       换行标签<br>

6.3.3.2.       水平线标签<hr>:属性有align、size、width、color、noshade

6.3.3.3.       内容居中标签<center>

6.3.3.4.       预格式化标签<pre>:将保留其中的所有的空白字符(空格、换行符),原封不动的输出结果(告诉浏览器不要忽略空格和空行)
说明:真正排网页过程中,<pre>标签几乎用不着。但在PHP中用于打印一个数组时使用。

6.3.4.       <body>标签的子标签(字体标签)

6.3.4.1.       标题<h1>到<h6>:属性有align。

6.3.4.2.       字体标签<font>:属性有color、size、face

6.3.5.       <body>标签的子标签(超链接<a>)

6.3.5.1.       外部链接<a>:链接到外部文件或网址。<a href="02页面.html">点击进入另外一个文件</a>

6.3.5.2.       锚链接<a>:比如说,在网页底部有一个向上箭头,点击箭头后回到顶部,这个就是利用到了锚链接。首先我们要创建一个锚点,也就是说,使用name属性或者id属性给那个特定的位置起个名字。注意上图中红框部分的#号不要忘记了,表示跳到名为name1的特定位置,这是规定。如果少了#号,点击之后,就会跳到name1这个文件或者name1这个文件夹中去。

6.3.5.3.       邮件链接<a>,同上

6.3.5.4.       超链接的属性:

6.3.5.4.1.      href:目标URL

6.3.5.4.2.      title:悬停文本

6.3.5.4.3.      name:用于设定一个锚点的名称

6.3.5.4.4.      target:告诉浏览器用什么方式打开目标页面

6.3.5.4.4.1.1.    self:在同一个网页中显示

6.3.5.4.4.1.2.    blank:在新的窗口中显示

6.3.5.4.4.1.3.    parent:在父窗口中显示

6.3.5.4.4.1.4.    top:在顶级窗口中显示

6.3.5.5.       图片标签

6.3.5.5.1.      标签<img>:img 是image“图片”的简写,代表的是一张图片,是单边标记。能够插入的图片类型是:jpg(jpeg)、gif、png、bmp。HTML页面不是直接插入图片,而是插入图片的引用地址,所以也要把图片上传到服务器上。

6.3.5.5.2.      属性src:src 是英语source“资源”的缩写。指图片的路径,在写图片的路径时,有两种写法:相对路径和绝对路径。

6.3.5.5.3.      其他属性:width、height、align、title、border、hspace(指图片左右边距)、vspace(指图片上下边距)、alt(当图片显示不出来时代替图片显示内容)

6.3.5.5.4.      相对路径:相对当前页面所在的路径。两个标记 ... 分表代表当前目录和父路径。../要么不写,要么就写在开头。

6.3.5.5.5.      绝对路径:绝对路径包括以下2种:以盘符开始的绝对路径和网络路径。

6.3.5.5.6.      总结一下:

    • 我们现在无论是在a标签、img标签,如果要用路径。只有两种路径能用,就是相对路径和绝对路径。
    • 相对路径,就是../ image/ 这种路径。从自己出发,找到别人;
    • 绝对路径,就是http://开头的路径。
    • 绝对不允许使用file://开头的东西,这个是完全错误的!

HTML标签

标签:rgb   名称   bmp   空白   段落   时代   分表   超文本标记语言   tom   

原文地址:https://www.cnblogs.com/zhandani/p/12236316.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!