zoukankan      html  css  js  c++  java
  • HTML基础学习

      什么是HTML? HTML是一种网页描述语言,举个例子:在任意网页上右键, 点击查看源代码, 可以看到网页的源代码,这源代码不就是HTML编写的吗? 实际上, HTML并不是像C++或者Java是一种编程语言,而是一种标记语言, 也就是一套标记(又叫标签,元素),因此相对于C++,它简单到姥姥家去了.

    图1 查看网页源代码

    一切从<html>...</html>开始

       HTML的标签是由尖括号(<>)围成的关键词, 比如<html>就是一个标签, 标签通常成对出现, 比如<html>和</html>, 其中, 第一个标签为开始标签(开放标签), 第二个为结束标签(闭合标签). 那HTML文档由哪几部分组成呢? 回答是HTML标签+纯文本(也就是说, 标签可以告诉我们其所围文本的格式(如实标题还是什么?), 标签规定了显示的格式). 我们常说的网页也就是HTML文档. 以下的内容部分来自于HTML基础教程. 第一个HTML程序如下所示:

    <html>
    <body>
    
    <h1>Hello, the HTML heading!</h1>
    <p>Hello, my first HTML parameter.</p>
    
    </body>
    </html>

          程序可由Notepad++编辑器进行书写, 然后保存成为.html文档, 双击用电脑的浏览器打开即可得到图2的网页显示. 程序里面:

    • <html>与</html>之间的文本用来描述网页,一般此标签的开始标签写在文档的最前面,结束标签写在最后面;
    • <body>与</body>之间的文本是可见的页面内容(还有不可见的是哪个???);
    • <h1>与</h1>之间的文本显示为标题(h是head的简写, 除了h1还有h2-h6这五个标签, h1的这个标题是最大的,然后依次减小)
    • <p>与</p>之间的文本显示为段落(不用说,p肯定是paragraph的简写)

    图2 上面程序得到的网页显示

      <html>与</html>标记要放在文档的最外层, 表示这对标记间的内容是HTML文档.

    文档头部标签<head>和</head>

       文件头用<head>和</head>标记,该标记要放在文档的起始位置(<html>标记之后,<body>标签之后), 标签里面的内容在浏览器里面不显示,主要用来说明文件的有关信息,如文件标题,作者,编写时间,搜索引擎等关键词.下面的这些标签可以用在<head>标签里面:<meta>,<link>,<base>,<script>,<style>,<title>.其中,<title>是文档的标题,也是head里面唯一必需的元素.

    文档主体标签<body>和</body>

       这是文档的主体部分,文档内所有内容包括文字,表格,图像,声音和动画等都要包括在<body>个</body>之间.

    <html>
    <head>
    <-- 文档头部信息 -->
    </head>
    <body>
    <--- 文档主体内容 ->
    </body>
    </html>

    HTML属性

          在标签里面,一般我们会对标签里面的内容设置一些属性,如何设置呢? 拿超链接标签<a>举例:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title></title>
    </head>
    <body>
    
    <a href="http://www.douban.com">douban!</a>
    
    </body>
    </html>

    生成的超链接显示为:

      这里,<a>里面的href就是一个内容douban!的一个属性,此属性值为:"http://www.douban.com",<a>的属性肯定不止是href,还有download,rel,target等等,很多标签都有自己的属性,具体的可以参考HTML标签参考手册.

      本文不讲其他具体的小标签, 只大致讲了HTML文档的组织结构和常见操作,标签有很多,没有必要一一地都记住, 重要的是掌握套路, 方法, 在用到的时候实时查询.

    参考:

    [1] HTML参考手册: http://www.runoob.com/tags/tag-img.html

  • 相关阅读:
    浅谈过拟合问题与梯度爆炸问题
    python 读取excel数据
    KNN与K-MEANS的区别
    jstree使用小结(二)
    jstree使用小结(一)
    webstrom 编码
    自定义分页
    js传递数组到后台
    创建等待图标
    js 日期格式化
  • 原文地址:https://www.cnblogs.com/zhao441354231/p/6001875.html
Copyright © 2011-2022 走看看