THML介绍及其使用

最新推荐文章于 2023-03-11 15:26:07 发布
最新推荐文章于 2023-03-11 15:26:07 发布
阅读量657 收藏
点赞数
文章标签： 操作系统 xhtml
原文链接：http://www.cnblogs.com/bravexz/p/5162875.html
版权

概述

什么是HTML

  • HTML 指的是超文本标记语言 (Hyper Text Markup Language)
  • HTML 不是一种编程语言，而是一种标记语言 (markup language)
  • 标记语言是一套标记标签 (markup tag)
  • HTML 使用标记标签来描述网页

HTML（Hyper Text Mark-up Language）是超文本标记语言，他是一种制作万维网页标准的语言。相当于定义统一的一套规则，一套标准，让所有用户遵守这一标准，这样就可以让浏览器根据标记语言的规则去解释。

浏览器负责将标签翻译成用户看得懂的格式，呈现给用户！

HTML标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

  • HTML 标签是由尖括号包围的关键词，比如 <html>
  • HTML 标签通常是成对出现的，比如 <b> 和 </b>
  • 标签对中的第一个标签是开始标签，第二个标签是结束标签
  • 开始和结束标签也被称为开放标签和闭合标签

HTML文档==网页

  • HTML 文档描述网页
  • HTML 文档包含 HTML 标签和纯文本
  • HTML 文档也被称为网页

Web 浏览器的作用是读取 HTML 文档，并以网页的形式显示出它们。浏览器不会显示 HTML 标签，而是使用标签来解释页面的内容：

更多解释：

  • <html> 与 </html> 之间的文本描述网页
  • <body> 与 </body> 之间的文本是可见的页面内容
  • <h1> 与 </h1> 之间的文本被显示为标题
  • <p> 与 </p> 之间的文本被显示为段落

Doctype

Doctype告诉浏览器使用什么样的html或者xhtml规范来解析html文档

  • BackCompat：标准兼容模式未开启；
  • CSS1Compat：标准兼容模式已开启。

这个属性会被浏览器识别并使用，但是如果你的页面没有DOCTYPE的声明，那么compatMode默认就是BackCompat模式，这样没有使用按照一套网页标准运行，会造成浏览器显示不同的样式。

如果你的页面添加了就相当于开启了标准模式，浏览器就会按照W3C标准解析渲染页面，这样在所有的浏览器中显示页面的就是一个样子的。

Doctype告诉浏览器使用什么样的html或xhtml规范来解析html文档，dtd文件则包含了标记、attributes、properties、约束规则等。

Meta（metadata information

提供有关页面的元信息，例如：页面编码、刷新、跳转、针对搜索引擎和更新频度的描述和关键词

1、页面编码（告诉浏览器使用的是什么编码）

　　<meta http-equiv="content-type" content="text/html;charset=utf-8">

2、刷新和跳转（如下的标点符号都为英文符合）

    <meta http-equiv=“Refresh” Content=“30″>

    <meta http-equiv="Refresh" Content="5; Url=http://www.baidu.com"/>

3、关键词

　　<meta name="keywords" content="星际争霸aaaaaaaaaaaaaaaaaaa">

4、X-UA-Compatible

微软的IE6是通过XP、Win2003等操作系统发布出来，作为占统治地位的桌面操作系统，也使得IE占据了通知地位，许多的网站开发的时候，就按照IE6的标准去开发，而IE6自身的标准也是微软公司内部定义的。到了IE7出来的时候，采用了微软公司内部标准以及部分W3C的标准，这个时候许多网站升级到IE7的时候，就比较痛苦，很多代码必须调整后，才能够正常的运行。而到了微软的IE8这个版本，基本上把微软内部自己定义的标准抛弃了，而全面的支持W3C的标准，由于基于对标准彻底的变化了，使得原先在早期IE8版本上能够访问的网站，在IE8中无法正常的访问，会出现一些排版错乱、文字重叠，显示不全等各种兼容性错误。

与任何早期浏览器版本相比，Internet Explorer 8 对行业标准提供了更加紧密的支持。 因此，针对旧版本的浏览器设计的站点可能不会按预期显示。 为了帮助减轻任何问题，Internet Explorer 8 引入了文档兼容性的概念，从而允许您指定站点所支持的 Internet Explorer 版本。 文档兼容性在 Internet Explorer 8 中添加了新的模式；这些模式将告诉浏览器如何解释和呈现网站。 如果您的站点在 Internet Explorer 8 中无法正确显示，则可以更新该站点以支持最新的 Web 标准（首选方式），也可以强制 Internet Explorer 8 按照在旧版本的浏览器中查看站点的方式来显示内容。 通过使用 meta 元素将 X-UA-Compatible 标头添加到网页中，可以实现这一点。

当 Internet Explorer 8 遇到未包含 X-UA-Compatible 标头的网页时，它将使用 指令来确定如何显示该网页。 如果该指令丢失或未指定基于标准的文档类型，则 Internet Explorer 8 将以 IE5 模式（Quirks 模式）显示该网页。

5、title 头部信息

　　<title>欢迎光临</title>

6、Link 连接

　　< link rel="shortcut icon" href="111.jpg">（相对路径）

2、常用标签

标签一般分两种：块级标签和 内行标签

各种符合，请参见如下文章：

 http://www.cnblogs.com/web-d/archive/2010/04/16/1713298.html

p和br

p表示段落，默认段落之间是有间隔的。

br 是换行

a标签

 

转载于:https://www.cnblogs.com/bravexz/p/5162875.html

weixin_30421809
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Html中value和name属性的作用及其使用介绍
09-28
name是控件的名称（多个控件可以取同一个名称），value是控件的值，下面为大家介绍下按钮、复选框、单选框、下拉菜单、隐藏域中的value所代表的含义及示例，有此需求的朋友可以参考下
THML+CSS基础
最新发布
m0_71732499的博客
07-16 448
<input type=" " name=" ">
THML基础
lmj19929的博客
03-11 533
THML
THML基础＜2＞
CL66848的博客
07-01 726
基本的JavaScript命令document.write()：打印指定的文本内容到页面上。 变量：用var声明变量。用来存储一个值，可以改变。 弹出框的命令alert()。 for循环常见6中练习题。
THML学习
qq_48741976的博客
06-29 544
HTML超文本标记语语言
第六十二节，html分组元素
weixin_34146410的博客
10-12 99
html分组元素   学习要点：     1.分组元素总汇     2.分组元素解析     本章主要探讨HTML5中分组元素的用法。所谓分组，就是用来组织相关内容的HTML5元素，清晰有效的进行归类。 一．分组元素总汇     为了页面的排版需要，HTML5提供了几种语义的分组元素。         元素名称                                 说明         ...
智能电池系统介绍及其应用
01-20
了解更多关于锂电池的产品信息请点击：https://www.dzsc.com/product/info/2804.html 　许多新技术，在提高性能的同时也增大了系统的功率消耗。对生产电池的化工企业来说，电池生产技术的实质性进展是很困难的，...
HTML 链接锚标签及其在SEO中的作用介绍
09-28
a标签主要用于定义链接和书签，又被称作超链接或锚(anchor)链接，最常见的用法是下面几种，需要的朋友可以看下
css expression使用概述及其优缺点介绍
09-25
css [removed]css表达式)又称Dynamic properties(动态属性)是早期微软DHTML的产物，微软从IE8 beta2标准模式开始，取消对css expression的支持，感兴趣的朋友可以了解下
thml的认识
zhao5752070的博客
05-25 417
html：超文本标记语言 常用浏览器(内核)：IE（Trident） 火狐（Gecko） 谷歌（Blink） Opera（Presto/Blink） Safari（Webkit） web标准的代码： 1.更利于网站的维护 2.提高浏览页面的速度 3.使web前景更加宽广 4.容易被更多更广泛的设备访问 5.降低流量的费用 6.更容易被搜索引擎搜索 web标准的构成： 结构 表现 行为 结构包括：html xml xhtml 表现包括：css 文字大小 颜色 外观 行为包括：JS h
THML——十二（父元素塌陷）
小伟
09-19 265
一、链接css样式 1、basic基础的 <link rel="stylesheet" type="text/css" href="css/basic.css"> 链接一个基础的css样式（头部、底部都一样时，那个页面用到直接链接css样式） 与下列例子功能一样（用下列可以少链接一个css样式） /*公共样式*/ * {margin:0;padding:0;/* box-sizin...
THML超链接元素
m0_67680689的博客
04-11 80
THML——十一
小伟
09-17 183
一、多行文本垂直居中来源链接 1、display:table和table-cell如何让文字垂直居中？ 父元素:display:table;块级表格元素 子元素:display:table-cell;表格单元格 vertical-align: middle;多行文字垂直居中 例如： .div1{ display: table; width: 1200px; height: 600px...
HTML学习笔记（九）HTML 表格
Sweety米修的专栏
05-04 644
你可以使用 HTML 创建表格。 表格 表格由 标签来定义。每个表格均有若干行（由 标签定义），每行被分割为若干单元格（由 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。 row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, c
{今日笔记}
lxqiuxi的博客
06-16 69
老六
THML
weixin_30654583的博客
09-07 218
结构<!DOCTYE html> <html> <head> <meta charset="UTF-8> <titie><title> </head> <body></body> ...
html中“↵”换行符号处理
岁末zzz的博客
04-19 5426
var myString = myString.replace(/(\r\n|\n|\r)/gm, "<br />");
THML——九
小伟
09-10 289
input标签（行内标签） placeholder:占位文字 password:密码 checked：checked 属性规定在页面加载时应该被预先选定的 input 元素。 checked 属性 与 或 配合使用。 selected： selected 属性规定在页面加载时预先选定该选项。 被预选的选项会显示在下拉列表最前面的位置。 resize:重置尺寸 1、文本域 用户： 2、密码域 密...
关于jquery中html()、text()、val()的区别
weixin_30540691的博客
05-08 450
.html()用为读取和修改元素的HTML标签 对应js中的innerHTML .html()是用来读取元素的HTML内容（包括其Html标签）,.html()方法使用在多个元素上时，只读取第一个元素 .text()用来读取或修改元素的纯文本内容 对应js中的innerText text()用来读取元素的纯文本内容，包括其后代元素;.text()方法不能使用在表单元...
请详细介绍props的使用
07-13
当你在Vue组件中使用props时，可以将数据从父组件传递到子组件。props可以接收父组件传递的数据，并在子组件中使用这些数据。下面是props的详细介绍和使用方法： 1. 在子组件中声明props： 在子组件的选项中（例如在`props`属性中），声明要接收的props及其类型。你可以指定props的类型，例如String、Number、Boolean、Array、Object等。例如： ```javascript props: { title: String, likes: Number, isPublished: Boolean, tags: Array, author: Object } ``` 2. 在父组件中传递数据给子组件： 在父组件中使用子组件时，通过绑定属性并设置对应的值来传递数据给子组件。例如： ```html <template> <div> <my-component :title="postTitle" :likes="postLikes" :is-published="postPublished" :tags="postTags" :author="postAuthor"></my-component> </div> </template> <script> import MyComponent from '路径/到/你的/子组件.vue'; export default { components: { 'my-component': MyComponent }, data() { return { postTitle: 'Vue Props', postLikes: 10, postPublished: true, postTags: ['Vue', 'Props', 'Component'], postAuthor: { name: 'John', age: 25 } }; } }; </script> ``` 3. 在子组件中使用props： 在子组件中，你可以像使用普通的数据一样使用props。可以在模板中使用插值表达式或者其他Vue指令来访问和展示props的值。例如： ```html <template> <div> <h1>{{ title }}</h1> <p>Likes: {{ likes }}</p> <p v-if="isPublished">Published</p> <ul> <li v-for="tag in tags" :key="tag">{{ tag }}</li> </ul> <p>{{ author.name }}, {{ author.age }}</p> </div> </template> <script> export default { props: { title: String, likes: Number, isPublished: Boolean, tags: Array, author: Object } }; </script> ``` 在子组件中，你可以通过`this.title`、`this.likes`等方式访问props的值。 通过以上步骤，你就可以在父组件中向子组件传递数据，并在子组件中使用props来展示和操作这些数据。希望对你有所帮助！如有任何疑问，请随时提问。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值