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

HTML 入门介绍

时间:2019-07-29 20:21:18      阅读:158      评论:0      收藏:0      [点我收藏+]

标签:更新   orm   rtc   样式   语言   机器   pre   link   平台   

HTML 简介

定义:

超文本标记语言(html)是标准通用标记语言下的一个应用,也是一种规范,一种标准

它通过标记符号来表示网页中的各个部分,网页文件本身是一种文本文件,通过在文本文件中添加标记符,可以告诉浏览器如何显示其中的内容(如:文字如何处理,画面如何安排,图片如何显示等)。浏览器按顺序阅读网页文件,然后根据标记符号解释和显示其标记的内容,对书写出错的标记将不指出其错误,且不暂停其解释执行过程,编写者只能通过显示效果来分析出错原因和出错部位,但需要注意的是,对于不同的浏览器,对同一标记符可能会有不完全相同的解释,因而可能会有不同的显示效果。

 

特点:

  1. 简易性:html 版本升级采用超集方式,从而更加灵活方便
  2. 可扩展性:html 的广泛应用带来了加强功能,增加标识符等要求,采取子类元素的方式,为系统扩展带来保证
  3. 平台无关性:虽然个人计算机大行其道,但使用 mac 等其他机器的大有人在,html 可以使用在广泛的平台上,这也是万维网(www)盛行的另一个原因
  4. 通用性:html 是网络的通用语言,一种简单、通用的全置标记语言,它允许网页制作人建立文本与图片相结合的复杂页面,这些页面可以被网上任何其他人浏览到,无论使用的是什么类型的电脑或浏览器

简单理解:正如我们写的 python 代码,运行时需要解释器来翻译,那么 html 代码的解释器就是浏览器,不过各自的解释规则不同。

 

结构:

<!DOCTYPE html> #html文档类型,这个是html5写法
<html>
    <head>

    </head>
    <body>

    </body>
</html>
<!--
以html开头和html结尾,中间包含了head和body,如果把html看作人,那么head就是头,body就是身体,所以头部里都东西一般都是看不见的。
<head>和</head>之间的内容,是元信息和网站的标题 元信息一般是不显示出来的,但是记录了该HTML文件的很多有用的信息
<body>和</body>之间的内容,是浏览器呈现出来的,用户看到的页面效果。也就是说这里是网页的主体。也就是body的身体之意。
-->

 

 

HTML 标签

html 标签指的是:<head>、<body>、<table> 等被尖括号包起来的对象,绝大部分的标签都是成对出现的,如 <table></talbe>、<form></form>,当然还有少部分不是成对出现的,如 <br>、<hr> 等,标签可以嵌套,比如在 body 标签中嵌套 form 标签,在 form 中又可以嵌套其他标签

 

标签分类

按语法分类:

  • 闭合标签:有开始表示和结束标签,必须成对出现,比如上面的 <html></html>
  • 自闭合标签:单个存在的标签,自己封闭,如 <br/>,这里不加 / 也不会出错

 

head 标签

head 头部中包含的标记是页面的标题、序言、说明等内容,它本身不作为内容来显示,但影响网页显示的效果

头部中最常用的标记符是 <title> 和 <meta> 标签

  • <title> 用于定义网页的标题,它的内容显示在网页窗口的标题栏中,网页标题可被浏览器用作书签和收藏清单
    <title>hello world</title>

 

  • <meta> 用于定义文档和外部资源之间的关系,提供有关页面的元信息,例如:页面编码、刷新、跳转、针对搜索引擎和更新频度的描述和关键词、页面转码
    <!-- 设置编码 -->
    <meta charset="UTF-8">
    <!-- 自动刷新页面 -->
    <meta http-equiv="Refresh" content="3">  <!-- 3 秒刷新一次页面 -->
    <!-- 跳转 -->
    <meta http-equiv="refresh" content="3;Url=http://www.baidu.com"> <!-- 3 秒钟后跳转至 www.baidu.com -->
    <!-- 关键字信息 -->
    <meta name="keywords" content="this is key word">
    <!--兼容IE:X-UA-Compatible-->
    <meta http-equiv="X-UA-Compatible" content="IE=IE9;IE=IE8;IE=EmulateIE7" />

     

  • link
    <link rel="stylesheet" href="css/common.css">   <!-- 样式 -->
    <link rel="shortcut icon" href="image/favicon.ico">  <!-- 图标 -->

     

 

HTML 入门介绍

标签:更新   orm   rtc   样式   语言   机器   pre   link   平台   

原文地址:https://www.cnblogs.com/kaichenkai/p/11266146.html

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