文档章节

婴姿坊微商城前端开发总结

o
 osc_odyg6b92
发布于 2018/07/13 15:56
字数 742
阅读 7
收藏 0

「深度学习福利」大神带你进阶工程师,立即查看>>>

1、当图标与文字在一起的时候,最快捷的方法是将连个元素设置为display:inline-block;vertical-align:middle;这就可以了,当图标元素显示的比较小或大的时候,可以设为其width和height;设置了这两项后可能会出现图标与文本对不齐的情况,可以设置图标元素的margin,这样基本可以解决

2、当设置一个文本元素在图片元素上定位时,可以将图片元素width=100%,但是这样的话会出现一个问题,就是当手机横屏幕或者关掉浏览器的手机预览模式时,会出现错位的情况,尤其是文本元素的定位为百分比数值的时候,这样可以将文本元素的定位设置为px等绝对的单位,基本可以解决这样的问题。还有就是当着两个元素在同一父元素的情况下,可以设置父元素的padding,这样可以保证元素不会错位。

3、移动端布局中最好用的布局方式是display:flex;这样会大大提高布局速度,尤其是为父元素设置相关的参数。flex布局方法可以参考http://www.runoob.com/w3cnote/flex-grammar.html

4、文字布局方式,文字可能会出现超出一定范围显示省略号的情况,使用的方法如下

  为父元素设置overflow: hidden;text-overflow:ellipsis;white-space: nowrap;

5、当有元素需要固定定位,尤其是顶部或底部导航栏,需设置position:fixed;但是这样会出现一个问题,就是该元素已经不占据文档流了,会导致文档错位,这样可以用一个元素进行站位,或者设置上下margin

6、微商城开发需要注意的问题之一就是要隐藏页面滚动条,但是还需要保持页面的滚动效果,可以选择jquery插件(jquery.mCustomScrollbar.min),当然,该插件需配合jquery使用,具体操作可以百度查看

7、该商城涉及到轮播不需要太多的自定义,但是仍需要对所引用的插件进行一定的修改,本项目中采用的是swiper插件,对分页器的样式做了修改。修改分页器的样式百度了很多方法,均无效。也可能是自己没有找到,在思索后,直接在浏览器调试中找到分页器里面type对应的class,然后去swiper的css中进行修改。由于本项目只有该插件需要修改,所以未做深入研究,但是值得一提的是swiper插件确实是一款好用的轮播插件

8、该项目有很多的点击效果,可以用jquery实现

9、本项目最大的问题就是移动端页面究竟该如何开发布局,暂停...

  

o
粉丝 1
博文 500
码字总数 0
作品 0
私信 提问
加载中
请先登录后再评论。
beego API开发以及自动化文档

beego API开发以及自动化文档 beego1.3版本已经在上个星期发布了,但是还是有很多人不了解如何来进行开发,也是在一步一步的测试中开发,期间QQ群里面很多人都问我如何开发,我的业余时间实在...

astaxie
2014/06/25
2.7W
22
Web开发组件管理器--Bower

Bower 是一个针对Web开发的包管理器。该工具主要用来帮助用户轻松安装CSS、JavaScript、图像等相关包,并管理这些包之间的依赖。 功能有些类似于Component。不同之处是,Component是围绕Git...

匿名
2013/02/01
1.2W
2
跨平台手机应用开发--Gideros

Gideros 可以让你轻松快速创建 iOS 和 Android 应用,提供用户友好的集成开发环境,内建模拟器对应用进行不同屏幕大小、分辨率下的测试,最大的优点是可即时修改代码即时进行测试,无需编译安...

匿名
2013/02/19
2.8K
1
Android3D应用与游戏开发框架--JQGL

JQGL 是一款针对Android设备上3D应用、游戏的开发框架。 核心功能是OpenGL-ES的使用框架,相对于大部分开发者而已,OpenGL是陌生的,没有专门研究无法进行相关的开发。 本框架针对于Android...

Jping
2013/02/21
1.6K
0
高效 Java Web 开发框架--JessMA

JessMA 是功能完备的高性能 Full-Stack Web 应用开发框架,内置可扩展的 MVC Web 基础架构和 DAO 数据库访问组件(内部已提供了 Hibernate、MyBatis 与 JDBC DAO 组件),集成了 Action 拦截...

伤神小怪兽
2012/11/13
9.2K
3

没有更多内容

加载失败,请刷新页面

加载更多

SwaggerUI看烦了,IGeekFan.AspNetCore.Knife4jUI 帮你换个新皮肤

背景 好像是上周四,看到微信群有人说java有轮子swagger-bootstrap-ui,而c#,就是找不到。 于是我一看,就说大话:“这个只是一套UI,他这个有开源地址么” 被@at说:你试试... 当天晚上就把...

张善友
今天
0
0
字符串驻留是个什么鬼!

先看下面这段代码 >>> a = 'apple' >>> b = 'apple' >>> a is b True 返回结果看起来没毛病 再来看这段: >>> a = 'apple!' >>> b = 'apple!' >>> a is b False 这个结果是不是有点诡异 前后......

谭庆波
昨天
0
0
golang包的日常(2)——log包

普通使用 log包定义了Logger类型,该类型提供了一些格式化输出的方法。 log包中预定义了一个标准logger对象std,使我们可以直接调用函数来打印日志,默认是标准错误输出(Stderr),打印到终...

osc_dg21zk4i
15分钟前
0
0
近10年全国高校双青人才排名TOP50,苏州大学表现抢眼

转眼又到了每年的杰青和优青项目评选的日子,作为高校人才水平的重要评判标准,每年高校的自然科学基金项目数都是一个非常重要的指标。当然,由于杰青每年只有200个名额,而国内有3000多所高...

科研菌
昨天
0
0
意派Epub360丨从制作到推广,H5页面如何刷屏?

不是所有H5最终都可以引爆朋友圈,也不是所有未能刷屏的H5都不够优秀。如何找到爆点、如何制作实现、如何传播转化……每一个要点都可能是影响刷屏的关键。即使是再资深的营销专家,也很难在H...

牙牙乐牙牙乐
15分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部