想要制作一个网页我们需要需要掌握:HTML、CSS、JavaScript语言。下面我们就来了解下这三门技术都是用来实现什么的:
1. HTML就像是一个大的盒子。我们可以把我们想要展示的内容、图片等装进这个盒子里边来表现;
2. CSS就像是盒子的包装。比如我们要给盒子添加颜色、给他塑造特殊的外观、装饰等,是用来给盒子添加样式的;
3. JavaScript这个就比较厉害了,这个是负责网页的动态呈现,就好比我们想要这个盒子有一个动的效果,而不是在那静静的呆着。
编码的软件有很多种,比如sublime text、vscode、webstorm等等,这里推荐新手使用Dreamweaver cc,简单易上手,不用安装其他的插件。
1)打开之前安装好的Dreamweaver软件,我们新建一个html的项目。(文件-新建-html)
2)这里Dreamweaver会自动的创建一个html的初始化模版,html包括“头”部分(英语:Head)、和“主体”部分(英语:Body),其中“头”部提供关于网页的信息(css/js一般放于头部中),“主体”部分提供网页的具体内容,顶部的!doctype是对文档类型声明,它的目的是要告诉标准通用标记语言解析器,它应该使用什么样的文档类型定义[DTD]来解析文档。
我们这里书写一个文字hello world让它在浏览器中显示并将颜色设置为红色。(具体的代码讲解我们后面会说到,这里这是给大家看一下网页展示)
3)整体代码完成以后,选择文件-保存,将文件保存为xxx.html的格式,然后双击打开我们的文件,就可以在浏览器上看到我们输入的hello world 的内容了,并且字体颜色是红色的。
大家可以自己动手写一写,多加练习练习。有什么好的建议或意见,可以私信联系我。
商美工我们也称之为电商视觉设计师,对于电商来说,他们是至关重要的一群人,很大程度上决定了电商产品销量的好坏。
所以,不管是自己有想法开一个自己的网上小铺,还是想成为一个专业的电商设计师,成为炙手可热的人才,一个清晰的学习规划是很重要的。
那么电商美工应该掌握哪些技能?零基础学电商美工如何快速入门?
【性格测试】60秒测试下自己适不适合从事设计师相关的工作:
http://m.tianhujy.com/zycsym2.html?wm=tt_hm_mgsj_12
(如无法点击,请长按复制到网址框打开即可)
电商美工应该掌握哪些技能?零基础如何快速入门?
首先,在学习之前应该先调整好心态,要知道学习是需要稳扎稳打的,学习美工也没有一步登天的方法。循序渐进的学习才可以学把技能学习扎实。那么电商美工应该掌握哪些技能呢?
“工欲善其事必先利其器”,美工的武器是什么呢?那当然就是设计软件咯。所以呢,一开始软件的掌握是非常重要的。
盘点一下美工必须掌握的软件。
PS:强大的位图软件,用于图片的处理、合成、修饰。
AI:强大的矢量图绘制软件,可以配合AI做一些好看的图片
DW:一款网页代码编辑软件,在我们需要实现特殊效果的时候需要用到。
当然,在这其中,最为重要的,也是工作中用得最多的就是PS,一般工作中95%以上主要使用的都是它。所以,往死里学,越熟练,你的优势越大。其他的是锦上添花的存在。
零基础如何快速入门呢?前面说到学习是要一步一步来的,如果是自学的话,花费的时间就会更多,如果有条件还是可以选择花钱去培训机构进行短期培训。当然如果你自控能力以及自学能力比较强,自学也是可以的,下面说一下新手如何学美工设计?
1、要学会提高自己的审美能力,进行网店优化、分类图片、上架排版;还需要对产品拍摄图片进行处理、美化、推广;执行商店有关广告制作,网店图标、图片、设计宝贝详情页制作,等等。
2、进行平面构成和色彩构成培训,认识和分析大量的商业色调和板式构成。对设计色彩的色相对比、明度对比、纯度对比进行分析,了解色调的心理色彩。
3、学习字体的设计,字体的适合性,在不同的页面、板式、封面等选择不一样的字体,另外,字体的可识别性,字体的视觉美观性,字体的艺术性,字体的商业性,字体设计个性,等等,都是美工设计需要学习的
4、对于很多初学的朋友来说,这些生涩的概念很不容易理解,这种时候,就需要多看书或者是上网找练习教程,加强自己的练习,软件这部分是比较花时间的、相对难点,需要多练。
5、软件是基础中的基础、设计者都离不开对设计软件的使用,其实学习软件听起来好像很容易,但是要做到“熟练”,离不开平时的不断练习。
avascript
一. js组成部分
ECMA:
文档对象类型: (DOM) document object module
浏览器对象类型:(BOM) broswer object module
5分钟了解javascript,简单明了
二. js能干嘛?
1.在HTML静态页面中写动态效果
2.对浏览器事件作出响应
3.在数据提交到后台之前进行数据验证
4.通过node.js擦作数据库
三. js特点
1.脚本语言
2.基于对象
3.动态性
4.跨平台
四. js输出
1.alert('输出的内容信息'); //浏览器弹框输出
2.document.write('输出'); //浏览器输出
3.console.log('输出'); //控制台输出
五.js的注释
跟PHP完全一样
1.单行注释: //
2.多行注释: /*这是注释内容*/
[总结]
1.在PHP中->表示访问属性或者方法 相当于"的"
2.在js中.也表示"的"
六.js变量
var 变量名=值;
[注意注意]
1.变量名必须严格区分大小写
[总结]
1.在PHP中每条语句结束之后都有分号.
2.在js中每条语句后面可以有也可以没有,但是我要求大家必须加上分号.
3.在html中程序是从上往下依次执行.如果想把js放到head里边执行,这是需要加上window.onload
window.onload=function ()
{
这里写操作内容
}
window: 指整个浏览器
onload: 指整个页面或者图片加载完成之后在执行的一个事件.
七. js中的函数
1.普通函数
function 函数名()
{
}
调用: 函数名();
2.匿名函数
function ()
{
}
调用: 需要给匿名函数赋一个变量, 变量名();
3.事件函数
window.onload=fucntion ()
{
}
八. PHP中流程控制
if
if-else
if-else-if
switch
for
while
do-while
foreach
js中的流程控制
if
if-else
if-elseif
在PHP中elseif中间可以有空格也可以没有
在js中elseif中间必须加上空格
for
while
do-while
switch
在PHP中case后边可以跟表达式
在js中case后边不能跟表达式, 但是进行赋值操作
for in
九. js的三要素
1.先获取
2.加事件
3.在执行
十. 获取元素
document.getElementById('ID的值');
document是整个文档对象流
它不能改变
document.getElementsByClassName('class得值');
document.getElementsByTagName('标签名');
document.getElementsByName('name的值');
document我们可以理解为父级,
他的父级是可以改变的.
十一. js中获取属性
marginLeft
marginRight
marginTop
marginBottom
paddingLeft
paddingRight
paddingTop
paddingBottom
fontSize
总结: 在css中中间使用-表示
在js中之间没有-,第二个单词首字母大写
十二.函数
1.在PHP中同一个文件里边不能定义两个相同的函数, 但是js中可以
2.在js中调用函数时,函数名相同时,以最后一个声明的函数为准.
3.匿名函数调用, 直接使用变量名();
十三. 单双引号的问题
1.双引号: 在PHP有解析的作用
在js中没有
2.在js单引号和双引号都表示普通字符
3.单不能能套单
4.双不能套双
5.单可以套双
6.双可以套单
十四. 报错问题
在js中程序一旦报错,不再往下执行
*请认真填写需求信息,我们会在24小时内与您取得联系。