HTML5第一个项目：HelloWorld！

最新推荐文章于 2024-04-20 20:30:09 发布
最新推荐文章于 2024-04-20 20:30:09 发布
阅读量1w 收藏 7
点赞数 1
分类专栏： web基础 安卓优化 文章标签： html5 helloworld web开发入门
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zhanghuakai01/article/details/70231291
版权

HTML5第一个项目：HelloWorld！

WebStorm具有强大的前端开发能力。
可参考

一.WebStrom 具有的优势

1. 智能的代码补

支持不同浏览器的提示，还包括所有用户自定义的函数(项目中)
代码补全包含了所有流行的库，比如：JQuery, YUI, Dojo, Prototype, Mootools and Bindows。

2. 代码格式化

代码不仅可以格式化，而且所有规则都可以自己来定义

3. html提示

大家经常在js代码中编写html代码，一般来说十分痛苦，不过有了智能提示，就爽多了。而且html里面还能有js提示。
代码编写中的html提示

4. 联想查询

只需要按着Ctrl键点击函数或者变量等，就能直接跳转到定义；可以全项目查找函数或者变量，还可以查找使用并高亮。

5. 代码重构

这个操作有些像Resharper，熟悉Resharper的用户应该上手很快，支持的有重命名、提取变量/函数、内联变量/函数、移动/复制、安全删除等等。

6. 代码检查和快速修复

可以快速找到代码中的错误或者需要优化的地方，并给出修改意见，快速修复。

7. 代码调试

支持代码调试，界面和IDEA相似，非常方便。

8.代码结构浏览

可以快速浏览和定位

9.代码折叠

功能虽小，不过胜在方便高效

10.包裹或者去掉外围代码

自动提示包裹或者去掉外围代码，一键搞定

二.本文可能用到的WebStorm的快捷键

快捷键环境 Mac os X 10.5+

功能按键
偏好设置Command + ，
快速插入一行，光标移到行首shift+回车
打开帮助command + shift + ／
删除一行command+delete
格式化代码command+option+L

三.快速建立一个HTML文件

创建工程
打开WebStorm——Creat New Project——（左边栏）Empty Project——（给项目命名）——（选择）Creat（确认建立一个工程）
进入编辑工程界面：

【方法一】在命名处右键——New——HTML File

【方法二】command +N——HTML File
给页面命名，点击OK
中文英文均可，推荐用英文命名，多多练习英文才是正道

四. 编辑网页

WebStorm强大的地方就在于它已经划分好布局，只需填写执行代码即可完成页面。

这里我们增加的代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
</head>
<body>
Hello，World！
</body>
</html>

五.查看网页

  1. 方式一：将鼠标至于网页文本上，右侧会弹出浏览器图标，点击一个已安装的就可查看。

  2. 方式二：工具栏View->Open in Browser->选择已安装的浏览器即可

六、设置webstorm快速浏览当前网页快捷键

webstorm 写的页面经常需要在浏览器中打开，为了提高工作效率，设置快捷键
步骤：

  1. mac按住Command健和 , 健， 打开设置面板。 或点击菜单 files –> settings(default setting)
  2. 在左侧菜单中搜索“keymap”,点击keymap，在右侧搜索 open in default browser，
    3.右击，选择add keymap shortcut。并设置快捷键（我用的command+i）完成设置。点击apply即可。
张华楷
关注
  • 1
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
C++第一课：Hello,World!
11-12
C++第一课：Hello,World!
Cocos2d-x-html5 之 HelloWorld 深入分析与调试
热门推荐
红孩儿的游戏编程之路
03-06 2万+
[Cocos2d-x相关教程来源于红孩儿的游戏编程之路CSDN博客地址：http://blog.csdn.net/honghaier 红孩儿Cocos2d-X学习园地QQ群：249941957  红孩儿Cocos2d-X学习园地QQ2群：44208467 Cocos2d-x-html5之HelloWorld深入分析与调试  另：本章所用Cocos2d-x版本为: Co
用html编写你好,02 - HTML5第一个项目：HelloWorld！（收藏）
weixin_31748999的博客
06-10 409
HTML5第一个项目：HelloWorld！WebStorm具有强大的前端开发能力。 可参考一.WebStrom 具有的优势智能的代码补支持不同浏览器的提示，还包括所有用户自定义的函数(项目中) 代码补全包含了所有流行的库，比如：jQuery, YUI, Dojo, Prototype, Mootools and Bindows。代码格式化代码不仅可以格式化，而且所有规则都可以自己来定义html提...
html5显示helloworld,helloworld-html5
weixin_42364551的博客
06-19 358
Thehelloworld-html5 quickstart demonstrates the use of CDI 1.2 and JAX-RS 2.0 using the HTML5 architecture and RESTful services on the backend.What is it?The helloworld-html5 quickstart demonstrates t...
html语言写helloword,HTML5 Hello World及标签认识
weixin_36290895的博客
05-31 665
从工作开始，开始从事android方面的开发，主要开发机顶盒方面, 在工作之余，学习了ios，也独自开发过一个上线的ios项目。最近工作不是太忙，于是想再学习一个新的语言，生命在于折腾！语言选择了html5，一是现在比较火，二是想自己写点个人页面玩玩好了，不叨叨了，开始吧开发工具，我选择sublime_textsublime_text写html页面，可以使用很多工具来写，包括文本文档，当然，为了效...
手把手教你用html写Hello World
Devil_ErKang的博客
03-25 7498
首先，我们先新建一个txt文件，鼠标右键，在新建里面找到文本文档，然后把文档名改成helloWorld.txt
如何利用WebStom创建HTML项目
qq_57767445的博客
04-28 3376
如何创建HTML项目 开发工具与关键技术： WebStorm 作者：吴炳霖 撰写时间：2021/4/28 注意看红色箭头，共有11个步骤，按顺序操作下去 先打开WebStorm； 如下图一的1，点击创建新项目； 图一 如下图二的2，点击文件图标； 如下图二的3，选择项目文件夹保存在哪个盘； 如下图二的4，点击确定； 如下图二...
html5
helloworld_hk的博客
06-08 106
html考试
HTML5 HelloWorld
wodamazi
10-08 241
参考写的html5 helloworld的代码: &lt;html&gt; &lt;canvas id="myCanvas"&gt;&lt;/canvas&gt; &lt;script type="text/javascript"&gt; var canvas = document.getElementById('myCanvas'); var context = canvas.ge...
HTML教程Hello World
一名可爱的技术搬运工
05-19 3680
在本教程中，您将学习如何使用HTML创建一个简单的hello world页面。 首先，让我们解释一些HTML基础知识。 HTML是代表H yper T外部中号 arkup 大号 anguage HTML是一个文本文件，由一组标记标签组成，例如（<html> <body> </ html> </ body>）。 几乎所有的标记标记都有开...
基于Xcode4开发第一个iPhone程序：“HelloWorld”
02-26
在开始之前，我们首先来分析一下项目需求，这是一个非常简单的项目，只要在屏幕上显示一段“HelloWorld”的文字，当然还有一些附加条件：根据这些需求，我们将从简单到复杂，逐步来实现，分成2步来实现：iPhone4之前...
Vue预习课2：Hello World 第一个程序
05-08
Vue预习课 Vue预习课 核心知识01——Hello World 引入Vue Hello World 理解Vue的设计思想 核心知识01——Hello World ...创建我们的第一个Vue程序 理解Vue的设计思想 数据驱动应用 MVVM模式的践行者
1023 Hello,World!的大小.cpp
04-30
1023：Hello,World!的大小 时间限制: 1000 ms 内存限制: 65536 KB 提交数: 55575 通过数: 21322 ...一个整数，即“Hello, World!”的大小。 【输入样例】 （无） 【输出样例】 （无） 【来源】 No
HTML5 ＜video＞ 标签属性、API 方法、事件、自定义样式详解与实用示例
JINGWHALE
04-17 1096
HTML5 video 标签为网页内嵌视频提供了强大且便捷的功能。本文对 video 标签的主要属性、API 方法、事件、自定义样式及其使用示例的详细介绍。
html5与css3前端学习笔记
我的个人博客
04-20 921
目前的状况是，有些CSS3属性需要加前缀，有些不需要加，有些只需要加一部分，这些加前缀的工作可以交给插件来完成，比如安装： autoprefixer，可以在Sublime text中通过package control 安装 autoprefixer。CSS权重指的是样式的优先级，有两条或多条样式作用于一个元素，权重高的那条样式对元素起作用，权重相同的，后写的样式会覆盖前面写的样式。3、E[attr^='ok'] 含有attr属性的元素且它的。2、E[attr='ok'] 含有attr属性的元素且它的。
2014年311教育学专业基础综合答案解析.pdf
04-24
教育学考研，考研真题，全国硕士研究生统一考试教育学专业基础综合真题及解析，311历年真题，参考答案，答案解析。教育学统考。
大语言模型安全测试方法
04-24
4月16日联合国日内瓦总部万国宫，由世界数字技术院（WDTA）与云安全联盟大中华区（CSA GCR）联合主办第27届联合国科技大会AI边会上，世界数字技术院（WDTA）发布了两项具有重要意义的国际标准：“生成式人工智能应用安全测试标准”和“大语言模型安全测试方法”。这是国际组织首次在生成式AI应用安全、大模型安全领域发布国际标准，为业界提供了统一的测试框架，标准的发布将对人工智能领域产生深远影响，推动人工智能技术的安全、可靠发展。 这两大标准由云安全联盟大中华区研究院副院长黄连金带领的专家团队编制而成，他们来自CSA大中华区、OpenAI、蚂蚁集团、谷歌、微软、亚马逊、英伟达、OPPO、科大讯飞、百度、腾讯、加州大学伯克利分校、芝加哥大学、香港科技大学等数十家单位，体现了业界的广泛协作与集体智慧。 云安全联盟大中华区主席、世界数字技术院执行理事长李雨航院士发布时介绍，“生成式人工智能应用安全测试标准”为测试和验证生成式AI应用的安全性提供了一个框架，特别是那些使用大语言模型构建的应用程序。它定义了人工智能应用程序架构每一层的测试和验证范围，确保AI应用各个方面都经过严格的安全性和合规性
基于ssm电商网站的设计与实现(部署视频)_kaic.zip
04-24
目 录 目 录 1 绪论 1.1 研究背景 1.2 目的和意义 1.3 论文结构安排 2 相关技术 2.1 SSM框架介绍 2.2 B/S结构介绍 2.3 MYSQL数据库介绍 3 系统分析 3.1 系统可行性分析 3.1.1 技术可行性分析 3.1.2 经济可行性分析 3.1.3 运行可行性分析 3.2 系统性能分析 3.2.1 易用性指标 3.2.2 可扩展性指标 3.2.3 健壮性指标 3.2.4 安全性指标 3.3 系统流程分析 3.3.1 操作流程分析 3.3.2 登录流程分析 3.3.3 信息添加流程分析 3.3.4 信息删除流程分析 4 系统设计 4.1 系统概要设计 4.2 系统功能结构设计 4.3 数据库设计 4.3.1 数据库E-R图设计 4.3.2 数据库表结构设计 5 系统实现 5.1用户信息管理 5.2 商品信息管理 5.3商品分类管理 5.1商品资讯管理 6 系统测试 6.1 系统测试的特点  6.2 系统功能测试 6.2.1 登录功能测试 6.2.2 添加类别功能测试 6.3 测试结果分析 结 论 致 谢 参考文献
Comfast CF-924AC V3无线网卡驱动
最新发布
04-24
https://editor.csdn.net/md/?articleId=137978326文章对应USB 1300M无线网卡驱动，使用方式请参考博文。本驱动为博文对应的RDK X3平台所用，其它平台根据博文链接下载源码编译。
以下程序的运行结果是 ( ) L=[1,1.3,"2","China",["","am","another"]] L.append("Hello World!") print(L[-1]) A:Hello World!B:!C:"""am","another"]D:World!
12-09
答案是A: Hello World!。 ```python L=[1,1.3,"2","China",["","am","another"]] L.append("Hello World!") # 在列表末尾添加元素 print(L[-1]) # 输出列表最后一个元素，即Hello World! ```

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值