建站资讯

网页设计之前端入门篇

2017-06-29 09:38:53

浏览:

很多对网页设计及开发感兴趣的的新人,刚上手的时候对标题里出现的第一个名词就摸不着头脑,碰上这种情况先不要慌。本文是专门对新人写的,零基础亦可读,仔细读读懂来,万变
很多对网页设计及开发感兴趣的的新人,刚上手的时候对标题里出现的第一个名词就摸不着头脑,碰上这种情况先不要慌。本文是专门对新人写的,零基础亦可读,仔细读读懂来,万变不离其宗明白其中的道理以后才是第一步,接下来再去思考接下的问题,这样才会更快成长。
一、什么是前端
首先,所谓的前端是指什么呢?前端(front-end)是相对后端(back-end)而言的,是描述进程开始和结束的通用词汇。在计算机程序中,前端作用于采集输入信息,后端进行处理。
而我们通常所说的「前端」,一般是指 web 前端,可以理解为网页的界面样式和视觉呈现。所以,前端设计一般视作网站的视觉设计,前端开发则是视觉设计的代码实现。
二、前端开发语言
HTML、CSS 和 JavaScript 是前端开发中三种最基础的代码语言。看到代码你先别急着关网页,先来欣赏下使用不同程序语言的程序员之间的鄙视链(笑)。
汇编 >C >C++ >Python >Java 及 C# 及 PHP(这三者相互撕) >VB > 那些坚持把 HTML 称为程序语言的人
所以你大概明白了,对于完全零基础的人来说,前端开发所用的语言(除了 JavaScript),是相对比较容易学习和上手的。
2.1HTML/CSS/JavaScipt
你可以把网页想象成一间房子。HTML 决定了网页的框架结构——有几间房间、作什么用途、里面摆放什么东西,CSS 决定了网页的样式——房间是如何装潢的(如墙壁是什么颜色的),JavaScript 则决定了网页上的用户交互和数据处理——用遥控器遥控电视。
下面简单介绍一下 HTML 和 CSS 语言的用处和用法,如果想继续学习,可以参考翁恺老师的两门公开课程——HTML5 入门 和CSS3。
2.2HTML
HTML 是一种网页标记语言。它主要是利用标签来告诉浏览器,标签之间的东西是什么——是标题、段落、图片还是链接等。浏览器则会根据 HTML 标签,相应地作出显示。下面举几个栗子:
 
1
2
3
4

这是 1 级标题


这是段落


这是链接的文字
 
2.3CSS
CSS 中文名叫做「层叠样式表」,从名字里就可以看出,它是一种声明样式的文档。我们可以通过链接外部 css 文档,或者将样式写在 HTML 文档的  标签中,抑或在 HTML 标签中内嵌属性  来实现对样式的定义。举个例子,我们要让 

这个段落

 的背景变成灰色,就可以用以下三种方法实现:
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/* 方法一:直接用 style 属性 */

这是段落



/* 方法二:在 HTML 文档的 标签中声明(会应用于页面中所有的

段落)*/

  


/* 方法三:通过外链实现 */
/* 另建一个 css 文档,在其中写上方法二中
网页设计之前端入门篇
很多对网页设计及开发感兴趣的的新人,刚上手的时候对标题里出现的第一个名词就摸不着头脑,碰上这种情况先不要慌。本文是专门对新人写的,零基础亦可读,仔细读读懂来,万变
长按图片保存/分享

深圳网站设计公司

启邦互动,深圳网站建设制作开发公司,擅长网站建设制作,欧美网站建设,外贸网站建设,国外网站建设。针对客户的预算提供不同的外贸网站解决方案

联系方式

深圳市龙岗区吉华街道水径综合楼6c-1

Call us : + 137 2425 9054

Email us : service@sz-qibang.com

在线咨询

您好,请点击在线客服进行在线沟通!

联系方式
热线电话
17727976231
上班时间
周一到周五
E-mail地址
service@sz-qibang.com
扫一扫二维码
二维码
扫码咨询
  • 取消
添加微信好友,详细了解产品
使用企业微信
“扫一扫”加入群聊
复制成功
添加微信好友,详细了解产品
我知道了