页面制作(PS/HTML/CSS)易错点总结

今天做了网易云课堂的页面制作试卷,虽然分数暂未公布,但是已经知道了自己这段时间以来的成效。下面总结几个易错点:

1.Photoshop切图:

图片保存格式:

a.图片色彩较为丰富但无透明度要求时应保存为jpg格式;

b.当图片色彩不太丰富时无论有无透明要求时保存为png8,且设置“杂边:无;扩散:无仿色”;

c.当图片有半透明要求,不对图片进行压缩,保存为24。

注意:PNG8格式图片的颜色模式是索引颜色,在修改前要先更改颜色模式为RGB颜色。

常用快捷键:

a.Alt+shift+Ctrl+s       存储为web常用格式;

b.shift+Ctrl+E             合并可见图层;

c.shift 添加到选区,alt 从选区中减去,shift+alt 选出交叉区域;

d.Ctrl+Alt+Z               多步撤销;

e.Ctrl++ 放大画布,Ctrl+- 缩小画布;

魔棒工具妙用:

a.可确定渐变是否为线性;

b.选择一个颜色单一的不规则区域.

注意:容差越小,可选范围越小。

2.HTML:

表单(form):

a.标签:<input><textarea><label><fieldset><legend><select><optgroup><option><button>;

b."input"中type值有:button、checkbox、file、hidden、image、password、radio、reset、submit、text

表格(table):

a.需要记得colspan跨列,rowspan跨行;

b.带有标题的table用<caption></caption>。

无序有序自定义列表:

由于很少用到自定义列表,所以要注意自定义列表表示方法"dl,dt,dd"

3.CSS:

a.行高:用%设置时,改变字体大小对行高不影响;

b.padding&margin用%来表示时,均表示父元素的宽的占比;

c.背景:颜色填充至padding(即不包含border);

背景图片默认在左上;

position:后者省略的话即默认为center。

d.border-shadow:x y 模糊半径 阴影大小 颜色:

        • 同outline一样不占空间
        • 0 0 0 1==设置1px border

e.优先级:行内样式(1000)>id(100)>类、伪类属性(10)>标签及伪元素(1)

f.position:stalic/absolute/fixed/relative

时间: 2024-10-21 13:40:20

页面制作(PS/HTML/CSS)易错点总结的相关文章

页面制作部分之PS切图

页面制作部分之PS切图 <--本标签下,通过页面制作.页面架构.javascript程序设计.DOM编程艺术.产品前端架构五部分来分享总结笔记,总结笔记会陆续分享--> 网页设计在技术层面上,第一步是美工做出网页效果图,第二步就是网页前端进行网页切图.网页切图工具常用的有fireworks.PS,这里使用PS进行网页切图. 我们通过设计稿,得到我们想要的产出物(如.png,.jpg文件),给网页提供图片素材(HTML:img,CSS:background). 一.使用PS工具 1.1 PS首选

易企秀 we+ Maka 兔展 四大H5页面制作工具

H5这个由HTML5简化而来的词汇,正通过微信广泛传播.H5是集文字.图片.音乐.视频.链接等多种形式的展示页面,丰富的控件.灵活的动画特效.强大的交互应用和数据分析,高速低价的实现信息传播,非常适合通过手机的展示.分享.也因其灵活性高.开发成本低.制作周期短的特性使其成为当下企业营销的不二利器,常见于企业宣传.活动推广.产品介绍.会议邀请.公司招聘等. 面对四大在线H5互动展示制作工具,企业营销应该如何选择更适合的H5制作工具呢?今天小编就给大家带来四大在线HTML5互动展示工具的评测. MA

php引入html页面 css报错 404

php引入html页面 css报错 404, html页面内 有css, 有一样 是这么写的 结果就报错了, 原来是 -moz这一句,在这句前面随便加一句别的样式就可以.... 原文地址:https://www.cnblogs.com/gaidalou/p/9778164.html

利用循环栏目导航标签及自定义页面制作帝国CMS网站地图

网站地图,又称站点地图,它就是一个页面,上面放置了网站上所有页面的链接.也简洁地表现了网站栏目关系,一般就包含顶级栏目和二级栏目.搜索引擎蜘蛛非常喜欢网站地图.在帝国CMS中没有生成网站地图的功能,所以嗨分享今天就给大家介绍一种方法生成它的网站地图. 主要用到帝国CMS中的两个重要知识点: 一.循环栏目导航标签(listshowclass) 二.自定义页面 第一步:增加标签模板 帝国CMS网站后台--[模板]-左侧[标签模板]-[管理标签模板] 可以增加一个标签模板,也可以直接使用 ID为1,模

PHP数据访问易错点(20161030)

易错点: 1.造对象的时候括号里面的参数 写错了 $db = new MySQLi("localhost","root","789","1016"); 2.牵扯到传值的,前面的名字和后面的名字不匹配 <form action="1028afternoonaddchuli.php"  method="post"> <div>代号:<input type=&qu

【干货】微信场景之H5页面制作免费工具大集合

营销代有手段出,各领风骚数百天.要说现在哪些营销方式最能传播,屡屡刷爆朋友圈的H5页面肯定就是首当其冲的,提到H5页面,就立马想到"围住神经猫",上线微信朋友圈3天的时间便创造了用户500万,访问量超1亿的神话. H5如此势头,不得不让营销人对H5页面的未来充满了期待,越来越多的人开始在营销中运用H5页面.其实在移动端各个领域,H5页面的叫法很多,也会称为翻翻看.手机微杂志.广告页.场景应用.海报\画报(动态海报.指尖海报.掌中海报.动画海报.微画报.微海报)等等,经常能见到的就是滑动

页面制作课程大纲以及学习进度

页面制作  开课时间:5月25日 单元(章) 课题(节) 视频名 学习天数 发布时间 1.Photoshop切图 1.工具.面板.视图 1.工具.面板.视图 3 5.25发布 2.测量.取色 1.测量.取色 3.切图 1.切图 4.保存 1.保存 5.修改.维护 1.修改.维护 6.图片优化与合并 1.图片优化与合并 2.开发.调试工具 1.开发.调试工具 1.开发工具 3 2.调试工具 3.HTML 1.HTML简介 1.发展史.概念 2.HTML文档 2.标签 1.语法 2.章节标签 3.文

页面制作之调试工具

页面制作之调试工具 转载于http://www.cnblogs.com/jingwhale/p/4509160.html 网易云课堂笔记 常用的调试工具有Chrome浏览器的调试工具,火狐浏览器的Firebug插件调试工具,IE的开发人员工具等.它们的功能与使用方法大致相似.Chrome浏览器简洁快速,功能强大这里主要介绍Chrome浏览器的调试工具. 打开 Google Chrome 浏览器,通过下面任何一种方式进入开发人员工具: -点击位于浏览器用户界面右上角的“页面”下拉菜单,“更多工具”

页面制作注意事项

V1.1 目  录 1. 引言 2 1.1. 编写目的 3 1.2. 适用的工作人员 3 1.3. 编写的范围 3 1.4. 适用的产品范围 3 2. 页面制作注意事项 4 2.1. 代码嵌套合理 4 2.2. 标签的语义化 4 2.3. 注释内容不能使用 "--" 4 2.4. 页面宽度的定义 4 2.4.1. 采用百分比设定页面宽度 4 2.4.2. 采用固定值设定页面宽度 5 2.5. 页面内容分部显示 5 2.6. 其它CSS文件的引入 6 2.7. 属性缩写的规则 6 2.8