听别人谈论这货,于是决定长长见识,见见世面,便屁颠屁颠到网上下一个,满怀好奇的研究了一下。对用过eclipse这款软件的人来说,上手非常容易。

  ☆ 准备工作

  ① 确认自己的电脑连接网络,能下载东西。

  ② 最好有一款主流浏览器。如谷歌,火狐,IE,Opera等(用这个工具都是做web的,浏览器很重要。)

  ☆ 下载HBuilder

  方式一: 在浏览器的地址栏中输入 http://www.dcloud.io然后回车进入

  方式二: 打开浏览器,访问百度搜索,输入HBuilder官网,然后点击进入

  上面的两种方式,任选一种。访问官网后如下图所示

  选择HBuilder之后,点击下载处弹出提示界面。

  点击即可下载。

  注:一般都是选择保存在哪,有部分会调用你的下载工具进行下载,如,迅雷,电驴等。

  ☆使用HBuilder

  找到下载HBuilder文件,这文件时绿色解压缩版。就是说不用安装,解压后直接可以使用。因此,我们必须找到自己存放这种绿色版的工具位置,粘贴该文件,然后解压,解压后删除压缩包。

  打开如上图所示的HBuilder文件夹,找一个HBuilder.exe文件,如下图所示

  选中该文件,右键-弹出菜单中选择“发送到”弹出菜单中选择“桌面快捷方式”,点击他。

  然后,我们在桌面就可以看到这样一个图标,将文件的名字改成HBuilder就可以。以后直接双击这个快捷方式,就可以直接打开HBuilder开发工具。

  ☆ 使用HBuilder

  双击HBuilder这个图标,打开软件。然后你会看到这样一个界面

  你可以选择注册一个用户来使用,也可以直接使用。点击暂不登录跳过这个界面,直接使用此工具。如果需要注册的可以自己注册,此处省略注册过程。

  进入的这个界面是一个欢迎界面,同时下面有该工具的使用的教程。可以先浏览器一遍,然后在来使用这个工具。同时整个软件界面使用的都是简体中文,看起来也相对容易。

  使用步骤:

  1,建立web项目(工具帮助你构建开发和解析html环境)

  2,建立web页面(这是就是我们经常说的网页)

  新建页面时,注意选择html5这一项,因为时下流行的就是html,选择这个之后,软件会自动生成html5的代码结构。

  注:meta标记的charset属性一般设置为utf-8

  这个工具的最大优点就是快捷键使用起来舒服和方便。

  ☆ HBuilder快捷键

  点击”帮助”菜单,在里面找到”快捷键列表”这一项,点击他,然后在整个工具布局的右边看到一个列表,这里面就是对快捷键的描述。

  对于快捷键的使用,大家可以自己慢慢体验和琢磨。只有用的时间长了,快捷键就会信手而来,练得次数多了,写起代码才有飞一般的感觉。

技术分享:www.kaige123.com

HBuilder从下载到使用的更多相关文章

  1. hbuilder的使用

    今天在群里看群友提及了hbuilder,下载试了下,发现确实会有些代码敲起来方便多了.也帮助我自己发现uft8和保存的时候选择字符重要,不然乱码,很窝心.

  2. HBuilder:最快的Web开发IDE

    这里给大家介绍一个个人觉得最好用的web开发工具:Hbuilder. HBuilder是DCloud推出的一款支持HTML5的Web开发IDE.快,是HBuilder的最大优势,通过完整的语法提示和代 ...

  3. 使用HBuilder+MUI+Flask后端服务器框架+Mongodb数据库开发手机APP

    1.开发准备HBuilder: 1.下载安装HBuilder2.创建APP项目 3.代码示例: <!doctype html> <html lang="en"&g ...

  4. hbuilder中的wap2app (将M站快速转换成App的开发框架)使用过程有关原生标题的关闭

    首先,我最近在做有关将M站快速转换成App的项目,在网上看了很多,最终结合同学的推荐,我选择了hbuilder,有关于hbuilder的下载还有具体使用方法,官网都有详细的说明,我就不介绍了,我重点介 ...

  5. Hbuilder环境下配置php

    XAMPP的安装 https://blog.csdn.net/qing666888/article/details/81914389 安装并配置好Xampp后,在Hbuilder中下载php插件,工具 ...

  6. MUI(1)

    今天小编用HBuilder+MUI开发移动APP,不用Android原生也不用IOS原生,仅仅用HTML5+MUI.小编也是初学者所以如有不准确的地方望大家指出帮助小编改正,同时也可以促进大家的深入学 ...

  7. uni-app—从安装到卸载

    uni-app实现了一套代码,同时运行到多个平台.支持iOS模拟器.Android模拟器.H5.微信开发者工具.支付宝小程序Studio.百度开发者工具.字节跳动开发者工具 工具安装 开发uni-ap ...

  8. wap2app(一)-- 网站快速打包成app

    工具:HBuilder,下载地址:http://www.dcloud.io/ 下载并安装HBuilder后,打开编辑器,选择:文件 -> 新建 -> 项目,出现如下图: 选择wap2app ...

  9. HTML5 Plus移动App(5+App)开发入门指南

    HTML5 Plus移动App,简称5+App,是一种基于HTML.JS.CSS编写的运行于手机端的App,这种App可以通过扩展的JS API任意调用手机的原生能力,实现与原生App同样强大的功能和 ...

随机推荐

  1. C# 操作office知识点汇总

    1. C#操作Word的超详细总结

  2. Android-做个性化的进度条

    1.案例效果图 2.准备素材                                progress1.png(78*78)              progress2.png(78*78) ...

  3. AngularJS多模块开发

    angularJS中的多模块开发是指多个module模块开发,步骤为: 1. 确定主模块    var app=angular.module('myApp',[]); 2. 其他的子模块添加到主模块后 ...

  4. 网站开发HTML部分课堂小结

    网页分为静态网页和动态网页两种 常用的是动态网页 静态网页修改数据是需要修改源代码,动态网页通过后台网页就可以修改静态网页有:HTML 内容(Hyper Text Markup Language 超文 ...

  5. PHP基础之POST与GET

    post 与 get区别 *.Post传输数据时,不需要在URL中显示出来,而Get方法要在URL中显示.*.Post传输的数据量大,可以达到2M,而Get方法由于受到URL长度的限制,只能传递大约1 ...

  6. Python requests模拟登录

    Python requests模拟登录 #!/usr/bin/env python # encoding: UTF-8 import json import requests # 跟urllib,ur ...

  7. 【Java EE 学习 23】【log4j的使用】【ant的使用】【内省】

    一.ant下载地址:http://ant.apache.org/bindownload.cgi  二.log4j下载地址:http://logging.apache.org/log4j/2.x/dow ...

  8. 字符串的replace()方法隐藏着什么不可告人秘密?

    最近在做JS算法项目时发现一个令我匪夷所思的问题, 这里想记录一下问题. 首先介绍一下字符串replace()方法的基本用法. replace() 方法使用一个替换值(replacement)替换掉一 ...

  9. Channel

    提起Channel,JDK的NIO类库的重要组成部分,就是提供了java.nio.SocketChannel和java.nio.ServerSocketChannel,用于非阻塞的I/O操作. 类似于 ...

  10. MemCache

    MemCache是一个自由.源码开放.高性能.分布式的分布式内存对象缓存系统,用于动态Web应用以减轻数据库的负载.它通过在内存中缓存数据和对象来减少读取数据库的次数,从而提高了网站访问的速度.Mem ...