随着互联网的不断发展与前端开发技术的不断进步,越来越多的人想在前端开发市场中分一杯羹,而HTML语言凭着它简单易懂的特性成为了不少计算机萌新的入门语言。那么什么是HTML呢?

什么是HTML

HTML,即超文本标记语言,是一种标识性的语言。它包括一系列标签,通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字,图形、动画、声音、表格、链接等。

使用HTML语言,将所需要表达的信息按某种规则写成HTML文件,通过专用的浏览器来识别,并将这些HTML文件“翻译”成可以识别的信息,即现在所见到的网页。而HTML标签是HTML语言中最基本的单位,是HTML最重要的组成部分。

什么是HTML标签

  • HTML标签是由一对尖括号括起来的关键词,像、等。
  • HTML标签通常是成对出现的,第一个标签是开始标签,第二个标签是结束标签。
  • 标签不区分大小写,最好用小写。
  • 标签可以嵌套,但是不可以交叉嵌套,如。
  • 有些标签功能比较简单.使用一个标签即可.这种标签叫做自闭合标签.如

    等。

标签分类

标签一般分为两种:

1. 块级标签

占一整行的标签。如、

、等

2. 行内标签

可以多个标签共同占用一行的标签。比如:,,,,等

3. 块级标签特点

  • 总是在新行上开始
  • 宽度缺省是它的容器的100%,除非设定一个宽度
  • 它可以容纳内联元素和其他块元素

4. 行内标签特点

  • 和其他元素都在一行上
  • 宽度就是它的文字或图片的宽度,不可改变
  • 内联元素只能容纳文本或者其他内联元素

HTML特殊字符

平时写代码很少用到HTML的特殊字符,最常用的可能是 (空格)了,但有时在移动端为了节省时间,可能会用这些字符实现某种特殊效果。

使用方法:

  • 这些字符属于unicode字符集,所以,你的文档需要声明为UTF-8;
  • 编号用在HTML中时,需要在前面加上符号;
  • 用于CSS文件中,但是需要用反斜杠转义;
  • 用于JavaScript,和CSS用法一样,不过要用u来转义。

常用HTML特殊字符

HTML基本标签简介

  1. 标签

作用:声明文档的解析类型(document .compatMode),避免浏览器的怪异模式。

浏览器有怪异模式(BackCompat)和标准模式(CSS1Compat)两种模式,那么何为怪异模式和标准模式呢?

  • BackCompat:怪异模式,浏览器使用自己的怪异模式解析渲染页面。
  • CSS1Compat:标准模式,浏览器使用W3C的标准解析渲染页面。

如果你的页面没有DOCTYPE的声明,那么compatMode默认就是BackCompat,,如果是这样的话那就很麻烦了-------浏览器按照自己的方式解析渲染页面,即在不同的浏览器显示不同的样式。

但是如果你的页面添加了,那么就等同于开启了标准模式,浏览器就得老老实实的按照W3C的标准解析渲染页面,这样一来,你的页面在所有的浏览器里显示的就都是一个样子了。

这就是的作用。

  1. 标签

标签用于提供关于 HTML 文档的元数据(元数据是关于数据的信息),元数据不会显示在页面上,但是对于机器是可读的。例如meta被用于设置关键字设置页面描述设置作者设置字符集设置页面定时跳转等等。meta标签放置在head标签中,对meta的设置对搜索引擎注册、搜索引擎优化排名等有至关重要的作用。

有两个属性,分别是http-equiv属性和name属性,不同属性有不同的参数,这些不同的参数使得名,meta标签有不同的功能:

http-equiv属性

顾名思义,相当于http的文件头作用,它可以向浏览器传回一些有用的信息,以帮助正确和精确地显示网页内容,与之对应的属性值为content,content中的内容其实就是各个参数的变量值。

  • 页面编码:
  • 页面刷新和跳转
  • 解决IE浏览器兼容性问题

name属性

name属性主要用于描述网页,与之对应的属性值为content,content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。

  • 供搜索引擎使用(关键词)
  • 网站信息描述
  1. 标签
  • title标签写网站头部信息,即网页标签的名称:

开云见日

  1. 标签

link标签有两个作用:

1.设置标签页图标:

2.外联CSS文件:

用于存放或编写css文件:

  1. 2.写js代码

  2. 常用标签

:n的取值范围是1~6; 从大到小. 用来表示标题.

:段落标签. 包裹的内容被换行.并且也上下内容之间有一行空白.

:加粗标签.:为文字加上一条中线.:文字变成斜体.:上角标 和 下角表.
:换行.:水平线

:白板,本身没有特性,块级标签。:白板,本身没有特性,行内标签。

的使用

这个文本包含 下标文本。

这个文本包含 上标 文本。

标签作超链接:跳转到指定url

作锚点:条转到指定id

标签

属性如下:

src: 要显示图片的路径.alt: 图片没有加载成功时的提示.title: 鼠标悬浮时的提示信息.width: 图片的宽height:图片的高 (宽高两个属性只用一个会自动等比缩放

HTML还有很多标签,像

、、
等等。在目前的移动应用开发大潮下,使用web技术进行移动应用开发正变得越来越流行,慢慢会变成
以HTML为核心的技术栈配合数据库的天下。让我们找准时代发展方向,努力学习,成为时代的弄潮儿吧!

html元素一行显示不完收缩_这些常用的HTML标签,你还不知道吗?相关推荐

  1. html元素一行显示不完收缩_CSS white-space norma nowrap强制同一行内显示所有文本不换行...

    DIV CSS white-space norma nowrap强制同一行内显示所有文本文字,让所有文字内容中一排显示不换行. 让文字不自动换行,无论CSS宽度设置多少,所有文字都在一行内显示.特别是 ...

  2. 编程 ul 不能一行显示 跳到下行_单片机编程魔法之三权分立

    在单片机编程中,有很多人会因为一些貌似简单的处理而把问题弄得乱七八糟,如林中蛛网一样,错综复杂. 而事实上,根据编程魔法之思想,对程序处理的过程严格划分部门.各施其职.部门内部互不干涉内政,是成功编程 ...

  3. 编程 ul 不能一行显示 跳到下行_史上最全的数控G代码编程详解

    一.G代码功能简述 G00------快速定位 G01------直线插补 G02------顺时针方向圆弧插补 G03------逆时针方向圆弧插补 G04------定时暂停 G05------通 ...

  4. linux多线程_免费Linux下载工具,你还不知道?

    今天小编要跟大家分享的文章是关于Linux运维人员应该知道的免费Linux下载工具.Windows用户在想要使用下载管理器时可以享受很多选择.如Download Accelerator Plus和Re ...

  5. java浮点数数转二进制的数吗_都工作两年了,还不知道浮点数如何转二进制?...

    来吧,坐下聊 先前在前文 <老大说:谁要再用double定义商品金额,就自己收拾东西走> 中就已经痛彻心扉地聊过: 在处理诸如 订单交易.货币计算.以及商品金额慎用浮点数(double/f ...

  6. CSS 入门2(样式属性+元素溢出+显示特性+盒子模型)

    css样式属性 常用布局样式属性 常用文本样式属性 元素溢出 显示特性 盒子模型 常用布局样式属性 <!DOCTYPE html> <html lang="en" ...

  7. 12 【网页布局总结 元素的显示与隐藏】

    18.网页布局总结 通过盒子模型,清楚知道大部分 html 标签是一个盒子. 通过 CSS 浮动.定位可以让每个盒子排列成为网页. 一个完整的网页,是标准流.浮动.定位一起完成布局的,每个都有自己的专 ...

  8. css-05--1. 定位2.. 网页布局总结3.元素的显示与隐藏

    目录 1. 定位 1.1 为什么需要定位 1.2 定位组成 1. 定位模式 2. 边偏移 1.3 静态定位 static(了解) 1.4 相对定位 relative(重要) 1.5 绝对定位 abso ...

  9. CSS学习221~249(定位+元素的显示隐藏)

    1 定位 1.1 为什么需要定位 浮动可以让多个块级盒子一行没有缝隙排列显示,经常用于横向排列盒子. 定位则是可以让盒子自由的在某个盒子内移动位置或者固定屏幕中某个位置,并且可以压住其他盒子. 1.2 ...

最新文章

  1. XenServer中License的设置对各种操作的影响
  2. 【PC工具】chrome插件:n多好用实用chrome插件
  3. 快速制作U盘WIN PE启动盘简易指南
  4. iOS-BMK标注覆盖物
  5. 【CSS3】CSS3背景相关属性大全
  6. 大多数可穿戴设备的基本原理总结
  7. 【算法学习笔记】03.白书练习题stat(排序入门:冒泡,桶)
  8. 传播路径图调查2013年初
  9. 【图像分割】基于matlab粒子群优化T熵图像分割【含Matlab源码 286期】
  10. c语言程序设计必备单词32个,c语言编程必背单词-20210324071350.docx-原创力文档
  11. 二进制与十进制的转换
  12. 如何自学Java 经典
  13. Android 使用经典蓝牙
  14. 广西行政村数据shp_全国 shp 矢量数据汇总(四):全国行政区划基础矢量数据(精确到乡镇级别)...
  15. RuoYi(若依)平台页面缓存无效
  16. 热更新你都知道哪些?
  17. crypto密码总结
  18. 拉姆达表达式转对象(太给力啦!)
  19. 去卢沟桥,看晓月还是数弹孔?
  20. postman时间参数化

热门文章

  1. 圣剑神域单机版服务器维护,圣剑神域单机版
  2. mysql explain字段含义,MySQL(十七):EXPLAIN 输出信息之 Extra 字段解释
  3. c语言第七周答案,2017-mooc-C语言-第七周-答案
  4. 关于addr=u32(r.recvuntil(‘\xf7‘)[-4:])的解释
  5. Python序列的增量赋值
  6. python的可变对象和不可变对象
  7. python函数不定参数求和
  8. Python这几个内置函数简直是屌爆了!!!
  9. android studil打断点_【小技巧】AndroidStudio利用断点打印日志
  10. 图像二值化之最大类间方差法(大津法,OTSU)