一、初识HTML

　　1.什么是HTML？

　　　　Hyper Text Markup Language（超文本标记语言）

　　　　扩展XML:Extendsible  Markup Language(可扩展性标记语言)

　　　　HTML(Hyper Text Markup Language)超文本标记语言是创建Web页面的基础，HTML由一套标记标签（Markup Tag）组成，在制作网页时，HTML使用标记标签来描述网页。

　　2.HTML的发展史

二、HTML5文件的基本结构

语法：

<html>

　　<head>

　　　　<title>html网页标题</title>

　　</head>

　　<body>

　　　　html网页主体

　　</body>

</html>

　　1.HTML5的基本结构分为两部分：

　　　　1.头部（head）

　　　　2.主体（body）

　　头部（head）包括网页标题（title）等基本信息；主体包括网页的内容信息，如图片、文字等。

　　2.网页的基本信息

　　　　（1）DOCTYPE声明

　　　　DOCTYPE声明必须在HTML文档的第一行：

　　　　　　<!DOCTYPE HTML>

　　　　（2）<title>标签、

　　　　使用（title）标签描述网页的标题：<title>网页标题</title>

　　　　（3）<meta>标签

　　　　使用（meta）标签描述网页的摘要信息，包括文档内容类型、字符编码信息、搜索关键字、网站提供的功能和服务的描述：<meta>标签描述的内容并不显示，

其目的是方便浏览器解析或利于搜索引擎搜索，它采用“名称/值”对的方式描述摘要信息。

　　　　<meta charset="utf-8"/>charset表示字符集编码，常用的编码有以下几种：

　　　　　　GB2312：简体中文，一般用于包含中文和英文的页面。

　　　　　　ISO-885901：纯英文页面。

　　　　　　Big5：繁体，一般用于带有繁体的页面。

　　　　　　utf-8：国际通用字符编码。

tips：

　　在保存文件时，编码方式一定要与html5页面<meta>标签中设置的编码方式一致，否则将出现乱码。

　　当遇到页面发生乱码时，可以先观察页面中是否有写编码方式的语句，然后使用记事本打开乱码文件，另存为中修改编码方式，使其与页面中的编码方式一致。

　　　　（4）搜索关键字和内容描述信息书写如下：

　　　　<meta name="keywords" content="北大青鸟"/>

　　　　<meta name="description" content="介绍描述"/>

　　keywords表示搜索关键字，description表示网站内容的具体描述。

　　　　通过提供搜索关键字和内容描述信息，方便搜索引擎的搜索。

tips：

　　使用WebStrom工具生成的HTML基本结构中的<head>标签里面有个属性lang="en"，它表示本页面是英文的。Chrome之类的浏览器会提示是否需要翻译。

三、HTML中常用标签

　　1.标题标签<h1>~<h6>字号逐渐变小

　　2.段落标签<p></P>和换行标签<br/>

　　3.水平线标签<hr/>

　　4.字体样式标签

　　　　<strong>字体变粗</strong>

　　　　<em>字体倾斜</em>

　　5.<!-- 注释 -->

　　特殊符号：

　　　　空格：&nbsp;　　大于号：&gt;　　小于号：&lt;　　引号：&quot;　　版权符号：&copy;

　　6.图像标签：<img src="路径地址" alt="替代文字" title="鼠标悬停文字" width="宽度" heigth="高度"/>

　　7.超链接标签：

　　　　语法：<a href="链接地址" target="目标窗口位置">链接文本或图像</a>

　　target：_self（自身窗口）、_blank（新建窗口）。

超链接的应用场合：

　　1.页面键连接：从一个页面链接到另一个页面；

　　2.锚链接：定位到目标页面内容中的某个具体位置；

　　　　语法：

　　　　在页面的乙位置设置标记<a name="marker">目标位置乙</a>

　　　　设置甲位置链接路径href属性值为“#标记名”<a href="#marker">当前位置甲</a>

　　3.功能性链接：

　　　　电子邮件链接的用法：mailto:电子邮件地址；

行内元素：内容撑开宽度，左右都是行内元素可以排在一行

块元素：无论内容多少，该元素独占一行

转载于:https://www.cnblogs.com/tengqiuyu/p/6956394.html

【学习笔记】HTML基础：使用html制作网页相关推荐

  1. html5教程 w3cschool,W3Cschool学习笔记——HTML5基础教程

    HTML5 建立的一些规则:新特性应该基于 HTML.CSS.DOM 以及 JavaScript. 减少对外部插件的需求(比如 Flash) 更优秀的错误处理 更多取代脚本的标记 HTML5 应该独立 ...

  2. JS学习笔记——入门基础知识总结

    JS入门基础知识总结1 前言 基础背景知识 一.产生历史: 二.特点: 三.应用方向: 四.Javascript组成: JavaScript书写使用方式 一.行内式(了解即可,项目中不使用,日常练习尽 ...

  3. C基础学习笔记——01-C基础第02天（用户权限、VI操作、Linux服务器搭建）

    在学习C基础总结了笔记,并分享出来.有问题请及时联系博主:Alliswell_WP,转载请注明出处. 01-C基础第02天(用户权限.VI操作.Linux服务器搭建) 打开终端:ctrl+alt+t ...

  4. HTML5学习笔记 —— JavaScript基础知识

    HTML5学习笔记 -- JavaScript基础知识 标签: html5javascriptweb前端 2017-05-11 21:51 883人阅读 评论(0) 收藏 举报 分类: JavaScr ...

  5. Docker:学习笔记(1)——基础概念

    Docker:学习笔记(1)--基础概念 Docker是什么 软件开发后,我们需要在测试电脑.客户电脑.服务器安装运行,用户计算机的环境各不相同,所以需要进行各自的环境配置,耗时耗力.为了解决这个问题 ...

  6. Python学习笔记_1_基础_2：数据运算、bytes数据类型、.pyc文件（什么鬼）

    Python学习笔记_1_基础_2:数据运算.bytes数据类型..pyc文件(什么鬼) 一.数据运算 Python数据运算感觉和C++,Java没有太大的差异,百度一大堆,这里就不想写了.比较有意思 ...

  7. python input 拖入路径 去除转义 空格_python学习笔记（基础-2）(转载)

    1.输出 用print()在括号中加上字符串,就可以向屏幕上输出指定的文字. 2.输入 如果要让用户从电脑输入一些字符怎么办?Python提供了一个input(),可以让用户输入字符串,并存放到一个变 ...

  8. php基础教学笔记,php学习笔记：基础知识

    php学习笔记:基础知识 2.每行结尾不允许有多余的空格 3.确保文件的命名和调用大小写一致,是由于类Unix系统上面,对大小写是敏感的 4.方法名只允许由字母组成,下划线是不允许的,首字母要小写,其 ...

  9. java基本语法心得_Java学习笔记(一)——基础语法(上)

    Java学习笔记(一)--基础语法(上) 软件构造 写在前面 编写Java程序时,应注意以下几点:大小写敏感:Java是大小写敏感的,这就意味着标识符Hello与hello是不同的. 类名:对于所有的 ...

  10. Python入门学习笔记1-Python基础

    Python入门学习笔记1-Python基础 前言:本文介绍了Python学习的前导知识概念以及必记基础函数,如善用help方法查看帮助文档,以及内置对象类型的概念以及常用函数的详解. 一.Pytho ...

最新文章

  1. php使用 js格式解析,php 无限级数据JSON格式及JS解析_PHP教程
  2. [POI2007]堆积木Klo
  3. 用python实现图书管理系统
  4. Linux的which查找环境变量的文件
  5. Python进阶（5）_进程与线程之协程、I/O模型
  6. 大开眼界！终于等到这部每一帧都是壁纸的纪录片！
  7. 【数字信号处理】基于DFT的滤波系列2(含MATLAB代码)
  8. import() 动态加载component组件失败
  9. ionic+AnjularJs实现省市县三级联动效果
  10. 对比原生Node封装的Express路由 和 express框架路由
  11. aba问题mysql_Mysql中select + update并发更新问题
  12. Doldrums：功能强大的逆向工程分析工具
  13. 视频图像标准：D1/D2/D3/D4/D5
  14. 有线猫眼监控_如何安装有线监控摄像头系统
  15. 行亦谦ACM自闭之旅第七周
  16. 蓝牙5最大速率分析报告
  17. Deci and Centi Seconds parsing in java
  18. Java的SSL连接
  19. 利用java查看本机的cpu、内存情况
  20. pyspark 数据类型转换_PySpark之DataFrame的创建与转换

热门文章

  1. python 自动化框架_学会Python+Selenium，分分钟搭建Web自动化框架！
  2. 七牛php连麦,七牛IOS连麦，主播端无法采集声音
  3. 400集python入门到精通_2020年最强Python学习路线+教程，400集带你从入门到精通
  4. cupload怎么保存图片_图片标注软件labelImg使用指南
  5. win2003无法进入桌面_电脑桌面怎么建立便签，可以在电脑桌面显示的便签
  6. 编辑bpmn_最好用的流程编辑器bpmnjs系列之ContextPad
  7. Python 解释器中使用help()命令如何退出
  8. B1.Java基础部分一
  9. 大数据学习笔记55：搭建HBase环境
  10. 安卓案例：View动画 - 弹球碰壁