总结(2018-1-21)

photoshop抠图大法

1.新建画布 ctrl + n

2.选中相应图层,如果有几层的,按住CTRL,选中所要合并的图层,要合并图层,才能移动,按住ctrl +并且 点击鼠标左键按住图,移动到画布


选中图层,移动画布.png

3.图像裁剪

按住ctrl+点击图标 鼠标移动图层右栏 点击选中图层 --鼠标箭头出现阴影

合并图层:ctr + e

合并图层.png

图像-裁剪
合并图层后,点击右下图层,鼠标出现小框框


图像-裁剪.png

保存切片时,到底是保存JPG格式还是PNG格式呢
jpg png 区别
参考链接:https://www.zhihu.com/question/29758228
png背景可设置透明

在保持图片的清晰度的情况下,控制图片的大小

在使用JQuery版本的问题上,需要注意的:
jQuery 1.9及以下的版本支持IE的所有版本

1.9以上版本不再支持IE9以下版本

针对一个页面H标签滥用的问题:
一、<h1>用来修饰网页的主标题,一般是网页的标题,文章标题,<h1>中部署主关键词。<h1>尽量靠近在html 中的<body>标签,越近越好,以便让搜索引擎最快的领略主题。

二、<h2>表示一个段落的标题,或者说副标题,部署长尾关键词。

三、<h3>表示段落的小节标题,<h3>效果跟Strong差不多,一般是用在段落小节。

四、<h4>-<h6>基本很少用到,是告诉搜索引擎这些不是很重要的内容,当一篇文章内容较多的时候,可以用来说明一些内容是不很重要的。

理论是不做过多的限制。建议还是不要多用,一般一个页面用一个H1标签对就可以了。

写页面总结:

1.分析页面的布局,发现可复用模块

2.css的公共样式,可复用样式

3.CSS命名,简洁,高效,一致性。

4.图片的命名,跟模块结合

5.借鉴他人的网站代码,快速出页面。

6.注意背景图片 no-repeat

7.外边距的合并

8.margin padding

9.想好布局,不要经常返工

修改input placeholder的字体大小颜色

input[type=text]::-webkit-input-placeholder{font-size:16px;color:#999;opacity:1}

input:-moz-placeholder{font-size:16px;color:#999;opacity:1}

input::-moz-placeholder{font-size:16px;color:#999;opacity:1}

input:-ms-input-placeholder{font-size:16px;color:#999;opacity:1}

使用到的工具:
1.用css工具美化代码
https://tool.lu/css/
2.图片大小压缩工具
https://tinypng.com/

写移动页面总结:
一、防止手机中网页放大和缩小,就是设置meta中的viewport

有些手机网站我们看到如下声明:

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
设置了DTD的方式是XHTML的写法,假如我们页面运用的是html5,可以不用设置DTD,直接声明<!DOCTYPE html>。

使用viewport使页面禁止缩放。 通常把user-scalable设置为0来关闭用户对页面视图缩放的行为。

完整的viewport设置,当然,user-scalable=0,有的人也写成user-scalable=no,都可以的。

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

遇到的坑:
1.定位元素 如何水平居中呢?
父元素 :position:relative;
子元素
position: absolute;
bottom: 4%;
left: 50%;
transform: translate(-50%,0);
代码例子:http://js.jirengu.com/tutogomowe/5/edit

2.定位元素 如何垂直水平居中呢?
父元素 :position:relative;
子元素
position: absolute;
bottom: 4%;
left: 50%;
top:50%;
transform: translate(-50%,-50%);
代码例子:http://js.jirengu.com/tutogomowe/3/edit

3.移动页面图片用img标签,不要用background:url(),这样图片很容易变形
.imgresponsive{max-width: 100%; display:block;}
max-width 与 width 区别
参考:https://developer.mozilla.org/zh-CN/docs/Web/CSS/max-width

4.移动页面单位什么时候用百分比,什么时候用rem
宽度,左右margin padding 用百分比
高度 上下margin padding 用rem,也有使用百分比的情况
但有时 margin padding 都用百分比

5.input 里的 class类名 不要跟name 值相同
参考网站:https://www.cnblogs.com/polk6/archive/2013/05/28/3101571.html

6.表单input中小图标跟背景图连在一起切成一张图,在移动页面会出现图标被拉伸的问题,图标会显得很难看
http://m.kgcedu.cn/special/news-48-67.html

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 213,254评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,875评论 3 387
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 158,682评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,896评论 1 285
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,015评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,152评论 1 291
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,208评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,962评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,388评论 1 304
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,700评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,867评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,551评论 4 335
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,186评论 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,901评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,142评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,689评论 2 362
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,757评论 2 351

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,744评论 1 92
  • 转载请声明 原文链接地址 关注公众号获取更多资讯 第一部分 HTML 第一章 职业规划和前景 职业方向规划定位...
    程序员poetry阅读 16,527评论 32 459
  • 3月1日 1. 你做的页面在哪些浏览器测试过,它们的内核分别是什么? IE:trident内核 Firefox:g...
    福尔摩鸡阅读 1,650评论 1 6
  • 写在我们认识的第五十九天,这不是一个特别的数字,不过却变成了特别的日子,我们相识,相遇,相恋,到半路甲人,用59天...
    忘记玳尔阅读 198评论 0 0
  • 很多人觉得,理财就是买股票、买基金,买各种理财产品;也有人认为理财就是投资获取高收益,更有部分人觉得理财是有钱人的...
    8846482d58c9阅读 340评论 0 0