首页 > 前端开发 > 正文

web前端开发怎么打开html web前端开发中怎样设

2023-10-03 02:25:16 | 我爱编程网

今天我爱编程网小编为大家带来了web前端开发怎么打开html web前端开发中怎样设,希望能帮助到大家,一起来看看吧!

web前端开发怎么打开html web前端开发中怎样设

web前端开发基础如何链接两个html文档

假设两个文档分别是 cs1.html和cs2.html,并且他们在同一目录下,那么下面就可以实现你所需要的功能、
在cs1.html上设置<a href="cs2.html">跳转到cs2页面</a>
在cs2.html上设置<a href="cs1.html">跳转到cs1页面</a>

web前端开发怎么打开html web前端开发中怎样设

Web前端开发怎么做

web前端开发工程师,做的工作与网站前/后台系统的页面相关,使用到的主要技术包括:HTML、CSS、JavaScript,如果能会后台编程语言,当然会更好。

现代web前端开发已经不能像传统web开发已经简单的描述成切图、css、js了(这是 @脑子不大 的回答)。在新的HTML5规范中,加入很多新的特性,这样就对web前端工程师有了更高的要求,比如数据库操作,使用cancvs、css3绘图。

切图这个概念已经是过去时了,早期由于技术匮乏,所以要将设计图切成一块一块,并拼接成网页。现在则能使用html5组织页面,使用css3绘图,很多元素已经不需要再使用图片还原设计,这是一个最大的进步。

JavaScript也在向更强大的编程语言发展,新的ECMAScript6的标准也在制定中。

最后,最重要的一点,Web前端技术的生态环境现在在发展,Chrome OS、Firefox OS都是未来能直接使用原生前端技术开发程序的系统。包括现在很多浏览器的插件,也是直接使用前端技术开发。NodeJS也是未来的一个大热门方向,它让前端技术可以做后台开发。

web前端开发怎么打开html web前端开发中怎样设

web前端开发中怎样设

虽说不知道你问的什么,

但是我还是把web前端开发如何入门发给你

web前端开发分为三个阶段:

1. HTML + CSS前端的入门门槛极低,体现在HTML和CSS上。运行环境就是浏览器,推荐Chrome。你需要的只是一个文本编辑器,推荐Sublime Text 3,有不少好插件比如Emmet,谷歌搜一下很容易了解到的。当然你非要用记事本的话,也不是不行的。刚入门查阅资料可以用 w3school 或者 MDN 。

HTML和CSS不是编程语言,前者只是结构标签,后者则是样式配置,入门是非常简单的。网上资料也有很多,推荐慕课网 HTML+CSS基础课程。
我当时是看了一本书 Head First HTML and CSS,讲得浅显易懂,不过价格比较感人,也是只翻一遍的书,没有必要买了。
迅速刷一遍慕课网,对HTML和CSS有个大致印象就好。想巩固HTML标签可以去看看16年的task1-1。
HTML5的API可以先放一放,回头再看。

接下来就是深入学习CSS了:

  • 《CSS权威指南(第3版)》。很枯燥的一本书,但我确实不知道哪本书更适合了。花两三天硬啃下来就好了。属性细节不必记忆,以后用到肯定要再查的。着重点放在大局上,比如盒模型,浮动和定位这些,抓住重点快速过一遍。

  • 《CSS3 专业网页开发指南》。CSS3也是需要掌握的内容。但这里还是以了解为主,知道CSS3有什么内容就好,记忆属性是枯燥且毫无意义的。


  • 以上内容用时5天左右,下面是实践。
    学了几天HTML和CSS了,应该也有点成果了。打开IFE2015 task1,写个静态页面吧。

    我X,完全写不出来。

    这是正常的。去看下别人的代码吧,看一小部分就开窍了。忘掉的属性就查书或者w3c,多尝试,不断踩坑才有进步。

    画完第一张图后,别着急往下写。你的代码肯定会有如下问题:

  • 胡乱的代码缩进

  • 毫无章法的属性顺序

  • 满页的div

  • 不停地写id和class

  • 重写吧,是的。重写之前先看一份代码规范 GitHub - ecomfe/spec: This repository contains the specifications.。当然代码规范不是唯一的,我最早看的是这一份,所以代码风格也一直维持到现在。
    再去看一下别人提交的代码,多看几份。当然自己也要判断,不能听风就是雨啊,人家写得不好你再去重写一次,等于你也有责任对不对。
    开始重写了,会发现功力大增,写代码速度也快了很多的。
    写到第三张页面的时候,应该比较熟练了。如果看到布局就大概知道应该怎么写了,那就可以进入JavaScript的学习了。
    以上内容用时10天左右。

    进阶部分可以回头再看:

  • 掌握预处理工具Sass,自动化工具Gulp。

  • 阅读Bootstrap源码。

  • 《CSS揭秘》,极其惊艳的一本书,涵盖了CSS3的很多奇技淫巧,虽说有些地方不太实用,但让人眼前一亮,很值得看。


  • 2. JavaScript

    这是至关重要的阶段。

  • 强烈推荐《JavaScript高级程序设计(第3版)》,俗称红宝书。前七章是重中之重,必须反复阅读,直至完全理解,期间可配合其他书一起读。DOM,事件流,表单,JSON,Ajax与最后几章也相当重要。其余章节可以略读或跳过(比如浏览器嗅探,XML以及那些列举大量API的章节,完全可以用到再查)

  • 推荐《JavaScript语言精粹》,俗称蝴蝶书。超薄的一本,半天就可以看完。JavaScript是一门有很多坑的语言,我个人是喜欢把这些坑点全部搞清楚的,但这本书却避而不谈了,剩下的也就是所谓的“精粹”了。但清晰地过一遍知识点总是好的。

  • 强烈推荐《你不知道的JS》。精彩至极的一本书,将JavaScript的坑一网打尽。之前搞不懂的问题,比如闭包,this之类的都可以在这里找到答案。

  • ES6也是必学的内容,推荐阮一峰老师的《ES6 标准入门》。但这本书以API居多,所以还是留个大概印象,以后写到类似的地方,查一查有没有ES6更简洁的写法就好,不必死记硬背。以及需要学会Webpack的使用,Babel和模块化就靠Webpack了。

  • 不太推荐《JavaScript权威指南》,也就是犀牛书。那就是一本字典…… 我爱编程网


  • 进阶:

  • 《JavaScript设计模式与开发实践》,设计模式是必须了解的内容,这本是写得不错的。

  • 《高性能JavaScript》,红宝书作者的另一力作,讲了一些优化技巧与性能瓶颈问题,值得一读。


  • 以上内容用时1个月左右,中途可穿插IFE2015 task2的题,比2016年的要简单。
    这些书全部刷完的话,应该可以跟人谈笑风生了。
    开始实践,IFE2016阶段二的题,想怎么刷就怎么刷吧。如果有编程经验的话,应该没什么压力了。

    3. JavaScript框架这部分就比较自由了,每个人点的技能树都不一样的。前端的发展是爆炸式的,换工具比翻书还快,所以还是以看文档为主了。
    目前主流框架经常被提及的是React,Angular,Vue。知乎搜一搜就有相当多的优秀答案了。不过这个答案也有时效性,说不定过两年这些框架全都被淘汰了呢【逃
    学习至少一种框架,把IFE2016刷通关吧。耗时1个半月左右。

    进阶:看各种源代码。这也是我最近打算做的事情,但是好像期末考要到了TAT

    最后补充一下,计算机基础知识是很重要的。由于本人有OI的经验所以稍微占点优势。再推荐几本书,抽空还是要看看的:

  • 《深入理解计算机系统》,CSAPP,也是我们专业这学期的课程(但是我的专业明明是EE啊)。

  • 《计算机网络 自顶向下方法》,看名字就知道必读了吧。

  • 操作系统好书挺多的,推荐一本 Operating Systems: Three Easy Pieces ,英文不够好就《现代操作系统》吧。

  • 算法和数据结构,推荐两本:《算法导论》《数据结构与算法分析》。似乎算法和数据结构与前端关系不大,但作为一个码农,不要求你写红黑树,至少快速排序和二分查找这种要会写的吧。

  • 请采纳!

以上就是我爱编程网整理的web前端开发怎么打开html web前端开发中怎样设相关内容,想要了解更多信息,敬请查阅我爱编程网。
与“web前端开发怎么打开html web前端开发中怎样设”相关推荐
web前端开发开头空格标签 html空格怎么打
web前端开发开头空格标签 html空格怎么打

如何在HTML中插入空格在前端开发中,有时候需要在页面中添加空格,那么如何添加?本篇文章就给大家介绍在html页面中插入空格的方法,希望对大家有所帮助。【相关视频教程推荐:HTML教程】一、键入空格在html页面中,我们可以通过键入“空格”键来插入空格。例:在p.p1中键入一个空格,在p.p2中键入5个空格。注:此时是半角状态键入“空格”&lt;pclass="p1"&g

2023-09-26 10:31:28
web前端开发乱码怎么办 打开.html网页文件乱码怎么办?
web前端开发乱码怎么办 打开.html网页文件乱码怎么办?

css网页乱码怎么办推荐:《css视频教程》解决方法一:CSS中出现的乱码都是由于CSS字符编码与页面的字符编码不一致所引起的,因此最直接的方法就是使字符编码一致。将CSS指定编码类型,例:@charset"utf-8";(指定编码类型为utf-8,须写在CSS文件第一行)解决方法二:CSS中出现的乱码都是由于中文字符引发的,因此只要不写中文,就不会产生“乱码引起CSS失效”

2023-10-10 11:31:32
web前端开发表格如何居中 html表格居中怎么设置
web前端开发表格如何居中 html表格居中怎么设置

用html做网页的时候怎么让表格的每行中的字都居中用html做网页的时候让表格的每行中的字都居中操作如下:1、首先按照常规,输入表格的文字内容,如下图所示,整体代码如下:&lt;table&gt;&lt;p&gt;功课表&lt;/p&gt;&lt;tr&gt;&lt;th&gt;语文&lt;/th&gt;&lt;td&gt;7:00-7:40&lt;/t

2023-10-09 18:07:52
怎样开发web前端设计 怎样自学web前端开发?
怎样开发web前端设计 怎样自学web前端开发?

Web前端开发怎么做在谈WEB前端怎么布局前,我们先梳理前端的布局类型,具体有以下几种:1.静态布局:不管浏览器尺寸具体是多少,网页布局始终按照最初写代码时的布局来显示。常规的pc的网站都是静态(定宽度)布局的,也就是设置了min-width,这样的话,如果小于这个宽度就会出现滚动条,如果大于这个宽度则内容居中外加背景,这种设计常见于pc端。2.流式布局:布局特点是屏幕分辨率变

2023-09-18 10:44:13
web前端开发怎么让字体居中 html怎么让文字居中
web前端开发怎么让字体居中 html怎么让文字居中

html怎么让文字居中可以用“text-align”属性控制文字的位置,“center”属性值让文字居中显示。1、新建html文档,在body标签中添加一个div标签,在div标签中添加p标签,这时文字将会在div标签中靠左显示:2、为div标签设置“text-align”属性,属性值为“center”,这时文本将会居中显示:3、如果想让文本靠右显示,可以为“text-a

2023-10-16 10:23:26
《web前端设计与开发》 web前端开发设计前景怎么样?
《web前端设计与开发》 web前端开发设计前景怎么样?

web前端开发学什么web前端开发学htmI+css+js,JQuery、html5+css3、http+ajax+json+nodejs+mysql+mongoDB等前后端交互、vue、react、小程序、app混合开发等进阶知识。基本简介:一、超文本(hypertext)。一种全局性的信息结构,它将文档中的不同部分通过关键字建立链接,使信息得以用交互方式搜索。它

2023-09-16 22:11:41
web前端开发怎么打开 什么是Web前端开发呢
web前端开发怎么打开 什么是Web前端开发呢

WEB前端项目开发流程这个环节是由项目经理完成,项目经理首先和客户进行交流,了解客户的需求,然后分析项目的可行性,如果项目可以被实现,项目经理写出项目需求文档交给设计师完成后续的开发。这个环节主要是UI设计师参与,UI设计师根据产品需求分析文档,对产品的整体美术风格、交互设计、界面结构、操作流程等做出设计。负责项目中各种交互界面、图标、LOGO、按钮等相关元素的设计与制作。这个部

2023-09-22 00:57:07
web前端开发htmltype用法 html中type="hidden"怎么用?
web前端开发htmltype用法 html中type="hidden"怎么用?

请问html代码中,type一共有多少种类型?你好,1、&lt;input&gt;标签的type属性button  定义可点击按钮(多数情况下,用于通过JavaScript启动脚本)。checkbox  定义复选框。file  定义输入字段和"浏览"按钮,供文件上传。hidden  定义隐藏的输入字段。image  定义图像形式的提交按钮。

2023-09-21 23:06:38