刚开始学HTML5 + CSS,用什么软件好?

一个大鸟帮我推荐了notepad++,然后我看教程的时候看到人家用的interlij idea,请问它们有什么区别?分别是干什么用的?我想用那种写了代码可以在网页上预览效果的软件。对这个是刚入行,所以不是懂得太多,在w3c和慕课上刚开始学h5+css
有没有低姿态、乐于助人的知乎人能给我个建议

回复内容:

notepad++ 是个编辑器 ,启动快速,功能全面,跑起来很高效。IntelliJ IDEA 是个集成开发环境,启动慢,功能多(大部分是你用不上的),但对新手更友好(主要体现在强大的搜索功能和无处不在的自动完成)。DreamWeaver 也是老牌的集成开发环境,就是贵了点。
我建议你用 notepad++ 类的软件,这样在学习的时候能够更理解本质。CSS 和 HTML 就那么点东西,手敲也不见得多累。装上 Zen Coding ,既高效又装B。

当然有空的时候能学学 Vim 就更好了。

1. 编辑器里边推荐sublime,这是通过自己的简单配置,能够顺手使用的一款,界面炫酷,主题漂亮,体验给力。

2. 另外vim,emacs,textmate入门曲线比较陡,不建议使用。

3. 另外简单点的:notepad++,editplus,选那个区别不大。notepad++有黑色主题,editplus启动还是那么快。

4. webstorm,phpstorm,intellijdea,随便选一款,都差不多。分别支持不同的后台语言而已。

而web前端开发乃及其它的相关开发,推荐sublime text, webstorm(jetbrains公司系列产品)这两个的原因在于,有个技术叫emmet, Emmet Documentation,而这两个对他的支持是:

立即学习“前端免费学习笔记(深入)”;

sublime text 是所有编辑器里边支持emmet比较好的的唯一一款。

webstorm是所有编辑器里边唯一内置emmet的一款,并且将emmet的精神往前推动的一款。

然后还是那句话:编程的核心是代码,代码的灵魂是算法或数据结构,所以你懂得,随便选一款得了。
phpstorm,idea包括所有webstorm的功能。只是phpstorm是针对phper的,idea是针对javaer,webstorm针对前端er。

一. css工具:

1. emmet Emmet Documentation

a. 可以以插件的形式安装在dreamweaver,notepad++,editplus,sublime各个编辑器上。

Zen Coding: 一种快速编写HTML/CSS代码的方法

zen coding更名为emmet,新加更多特性

zen coding更新到 0.7

zen coding资源更新

zen coding的dreamweaver插件安装教程

emmet在sublime上的效果:

1). css :他与其它编辑器的区别在于细节上,比如ctrl,alt+方向键可以修和里边的数值

2). html 效果:

3). sublime的emmet规则修改:

packages->Emmet->emmet->snippets.json

b. 只有一个例外jetbrain公司的产品线:webstorm,phpstorm,intellij idea都是内置的,不需要安装。

1).

写js的效果:

2). webstorm的emmet规则修改:Files -> settings -> Live Templates

另外对前端开发感兴趣的加这个群:327388215

用什么编辑器无所谓吧,先保证你能静下心学sublime text 3。我一直都是用Brackets
Brackets – A modern, open source code editor that understands web design.这就是编辑器,难道学习这方面的还要特定的软件吗?我说记事本也可以帮你工作,你信吗?工具都不是重要的,重要的是你要去真心的学习。用HBuilder爽死你感觉GitHub出的Atom不错,就是插件还不太完善。DCloud HBuilder-做最好的HTML5开发工具
对于那些跟你推荐用notepad++来学习h5+css的,我真的不好多说什么!Hbuilder

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2912664.html

(0)
上一篇 2025年3月11日 05:36:41
下一篇 2025年3月11日 05:36:56

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • 请教前端的正确学习方式?

    本专业是通信,大三下学期突然想学前端,现在大四上,学了html和css,现在正在学js核心语法,看的是权威指南,也没有做过什么项目,打算先把js看一下,再说做项目练习,我不知道这个方法是否正确合理,或者有什么适合我这个阶段的前端新手做的项目…

    编程技术 2025年3月11日
    200
  • CSS+HTML5的使用方法实例

    1.HTML5基础 文档类型 登录后复制 使用video和audio标签播放视频和音频 登录后复制   立即学习“前端免费学习笔记(深入)”;   立即学习“前端免费学习笔记(深入)”; 2.弹性盒子   立即学习“前端免费学习笔记(深入)…

    2025年3月11日 编程技术
    200
  • css3+javascript怎么做一个旋转的3d盒子?

      今天写点css3,3d属性写的3d盒子,结合javascript让盒子随鼠标旋转起来 今天带了css3新属性3dnbsp;html>#a{width: 200px;height: 200px;margin: 200px auto;…

    2025年3月11日
    200
  • 在线演示一个全屏切换效果实例

        在线演示: DEMO DEMO中及以下代码并没有写兼容代码,请使用高级浏览器打开,IE版本对CSS3支持并不太友好,IE11打开没有滚屏效果。 兼容代码前缀: -webkit- -moz- -o- -ms-   直接上代码: pag…

    2025年3月11日
    200
  • Less与Sass框架如何使用?

    一、less语法   1.变量声明:     @变量名:变量值;  1 @newHeight:20px; 登录后复制   2.调用变量: 1 .box {2 width: @newHeight;3 height: @newHeight; 4…

    编程技术 2025年3月11日
    200
  • CSS3 Flexbox该怎么使用?

    文章来源: 一、前言 Flexbox 是一个 CSS3 的盒子模型 ( box model ),顾名思义它就是一个灵活的盒子 ( Flexible Box ),为什麽最近这个属性才红起来呢?最主要也是因为 CSS3 的规范终于普及 ( 或 …

    2025年3月11日 编程技术
    200
  • css书写顺序需要注意哪些?

    一、css顺序   首先声明,浏览器读取css的方式是从上到下的。我们一般书写css只要元素具备这些属性就会达到我们预期的效果,但是这会给以后的维护和浏览器的渲染效率带来一定的影响,那么该怎么书写css的顺序呢?有没有一定的规范呢?   首…

    编程技术 2025年3月11日
    200
  • 移动端全景装修图的实现实例分享

    移动端全景装修图的实现实例分享 nbsp;html>Documentbody,html {margin: 0;height: 100%;overflow: hidden;position: relative;}.wrap {posit…

    编程技术 2025年3月11日
    200
  • css动画制作——CSS animate

    熟悉css的人都知道,css可以实现很多漂亮的动画,特别是它的在线功能,能够帮助人们解决很多制作动画的效果。今天特别推荐一个在线css插件功能——cssanimate,这个最大的特色就是以图形界面方式让你轻易实现漂亮的css3动画效果,下面…

    2025年3月11日 编程技术
    200
  • IDEA如何安装vue开发插件安装图文教程

    前言: 开发免不了要用到开发工具,什么sublime,webstorm,idea的,现在我就说下idea开发神器下安装vue插件进行vue项目的开发吧。 idea下载地址: idea神器可以干的事: idea安装vue插件  1.File&…

    2025年3月11日 编程技术
    200

发表回复

登录后才能评论