HTML新手入门（1）

——编译器下载及基础框架

一、编译器下载

作为新手，听取大佬的建议，用HBuilder进行编译。

下载地址：www.dcloud.io/

进入到首页左上角有一个如下图标。

（这里简单介绍一下HBuilder与HBuilderX的区别）

HBuilderX简称HX。

HX的优势：

  1. HX性能更强，启动速度、大文档打开速度、代码提示速度均极为流畅。
  2. HX的VUE语法提示、ES6语法提示支持更强大，应该是最强悍的vue提示工具。
  3. HX有内置终端，对于现代编译型语言的开发提供更强的支持。
  4. HX支持uni-app、小程序开发、快应用开发。
  5. HX的markdown、json方面秒杀其他开发工具。
  6. HX新增了智能双击、更完善的多光标处理，可为极客提供更高效的操作。

二、概念知识

HTML（Hypertext Markup Language——超文本标记语言）

三、基本框架

接下来介绍一下HTML的基础框架：如下图：

<!DOCTYPE html> 声明为 HTML5 文档。

<html> 元素是 HTML 页面的根元素。

<head> 元素包含了文档的元（meta）数据，如 <meta charset="utf-8"> 定义网页编码格式为 utf-8。

<title> 元素描述了文档的标题。

<body> 元素包含了可见的页面内容。

<h1> 元素定义一个大标题。

<p> 元素定义一个段落。

运行结果如下图：

注：如果你想在某一行中加入注释，如下图：

当然可以用快捷键：Ctrl+/（与eclipse中加注释的方法一样）

<html>与</html>是开始标签和结束标签。（对于其他的标签也一样！）

关于<!DOCTYPE>是不区分大小写的，后面所跟的html也可为HTML、Html、htML等等。

<!DOCTYPE>的通常声明有：<!DOCTYPE html>  //HTML5

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">     //HTML 4.01

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  //XHTML 1.0

关于<title>是网页上端的标题即：

结束语：后续将持续更新，因为本人也是个菜鸟，学习的过程中就以记笔记的形式，将自己的知识点总结到我的博客上。

HTML新手入门（1）的更多相关文章

  1. 新手入门指导：Vue 2.0 的建议学习顺序

    起步 1. 扎实的 JavaScript / HTML / CSS 基本功.这是前置条件. 2. 通读官方教程 (guide) 的基础篇.不要用任何构建工具,就只用最简单的 <script> ...

  2. Flume NG Getting Started（Flume NG 新手入门指南）

    Flume NG Getting Started(Flume NG 新手入门指南)翻译 新手入门 Flume NG是什么? 有什么改变? 获得Flume NG 从源码构建 配置 flume-ng全局选 ...

  3. 原创：从零开始，微信小程序新手入门宝典《一》

    为了方便大家了解并入门微信小程序,我将一些可能会需要的知识,列在这里,让大家方便的从零开始学习:一:微信小程序的特点张小龙:张小龙全面阐述小程序,推荐通读此文: 小程序是一种不需要下载.安装即可使用的 ...

  4. 【原创】新手入门一篇就够：从零开发移动端IM

    一.前言 IM发展至今,已是非常重要的互联网应用形态之一,尤其移动互联网时代,它正以无与论比的优势降低了沟通成本和沟通代价,对各种应用形态产生了深远影响. 做为IM开发者或即将成为IM开发者的技术人员 ...

  5. 课程上线 -“新手入门 : Windows Phone 8.1 开发”

    经过近1个月的准备和录制,“新手入门 : Windows Phone 8.1 开发”系列课程已经在Microsoft 虚拟学院上线,链接地址为:http://www.microsoftvirtuala ...

  6. WordPress建站 新手入门

    WordPress建站 新手入门教程系列 1. WordPress入门 之 什么是WordPress? 2. WordPress入门 之 搭建WordPress站点需要什么条件? 3. WordPre ...

  7. 安卓自动化测试（2）Robotium环境搭建与新手入门教程

    Robotium环境搭建与新手入门教程 准备工具:Robotium资料下载 知识准备: java基础知识,如基本的数据结构.语法结构.类.继承等 对Android系统较为熟悉,了解四大组件,会编写简单 ...

  8. mongodb新手入门，mongodb命令学习

    下面来总结一下mongodb新手入门的常用命令吧.要是您是mongodb新手,可以看下. 1,show dbs 查询mongodb里面的数据库列表 如果想查看当前连接在哪个数据库下面,可以直接输入db ...

  9. iOS简易柱状图(带动画)--新手入门篇

    叨逼叨 好久没更新博客了,才几个月,发生了好多事情,处理了好多事情.不变的是写代码依然在继续. 做点啥子 看看objective-c的书,学着写了个柱状图,只是练习的demo而已,iOS上的图表控件已 ...

  10. discuz插件开发新手入门 超详细

    作为一个新手,目前也是刚刚玩转discuz的插件功能,好东西不敢独享,就拿出来大家一起分享入门的过程.现在网上很多关于discuz的插件教程都是很简单的教程,原因可能是这个东西是商业化的东西,本着分享 ...

随机推荐

  1. ciscn-华北赛区-Day1-Web2题解

    漏洞点 薅羊毛逻辑漏洞 Cookie伪造 -> JWT python反序列化 -> 反弹shell 薅羊毛逻辑漏洞 打开题目是这样一个页面 其实最初的题目这个募集资金的进度条是没有刷满的, ...

  2. 阿里云服务器挖矿脚本bioset攻击解决

    1.问题出现 一大早刚起床,阿里云就给我发了一条短信,提醒我服务器出现紧急安全事件:挖矿程序 阿里云“贴心”地提供了解决方法,不过需要购买企业版的安全服务,本着能自己动手就不花钱原则自己搞了起来 于是 ...

  3. java-selenium-java鼠标键盘操作Actions类和Robot

    Actions类 一.鼠标右击.双击 Java代码 //定位百度首页右上角 新闻 WebElement Xw=driver.findElement(By.xpath("//*[@id='u1 ...

  4. C++拷贝构造函数：浅拷贝与深拷贝

    在介绍C++浅拷贝与深拷贝之前,我们先引出C++的拷贝构造函数. C++拷贝构造函数是一种特殊的构造函数,其形参是本类对象的引用.用于在建立一个新的对象时,使用一个已经存在的对象来初始化这个新对象.因 ...

  5. PYQT5 pyinstaller 打包工程

    win+R 输入cmd  回车 首先安装 pyinstaller : pip install pyinstaller 安装 pywin32: pip install pywin32 在cmd中输入工程 ...

  6. 用纯 CSS 创作一个在容器中反弹的小球

    效果预览 在线演示 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/jKVbyE 可交互视频教 ...

  7. Java new运算符解析

    1.创建数组时,不使用new操作符 Person [] a; a[0]=new Person(); //Error:variable a might not have been initialized ...

  8. Spring配置redis及使用

    一.redis简介 Redis 是完全开源免费的,遵守BSD协议,是一个高性能的key-value数据库 Redis支持数据的持久化,可以将内存中的数据保存在磁盘中,重启的时候可以再次加载进行使用. ...

  9. spring boot @Value源码解析

    Spring boot 的@Value只能用于bean中,在bean的实例化时,会给@Value的属性赋值:如下面的例子: @SpringBootApplication @Slf4j public c ...

  10. TVM:一个端到端的用于开发深度学习负载以适应多种硬件平台的IR栈

    TVM:一个端到端的用于开发深度学习负载以适应多种硬件平台的IR栈  本文对TVM的论文进行了翻译整理 深度学习如今无处不在且必不可少.这次创新部分得益于可扩展的深度学习系统,比如 TensorFlo ...