⚽️微信小程序
wx.previewImage(Object object)
wx.previewImage(Object object):在新页面中全屏预览图片。预览的过程中用户可以进行保存图片、发送给朋友等操作。
这是小程序开发文档中关于图片的一个API
这次开发中学习并运用了一下。
1 | methods = { |
1 | <view wx:for="{{pdfImgs}}" wx:for-item="item" wx:key="{{index}}" class="{{pdfImgs.length>1 ? 'pdf-img-2' : 'pdf-img-1'}} {{pdfImgs.length>2 ? 'pdf-img' : 'pdf-img-1'}}"> |
这里在图片展示的样式上,做了一个处理。
因为UI设计的 pdf图片展示中,只有一张图,两张图,三张图以及更多的样式分别不同。所以用两个三目运算进行判断。
踩坑
picker-view picker-view-column
问题:设置value失效,初始化后,默认还是为[0,0]
原因: value要在生成picker-view-column之后,再setData,否则默认值设置不成功。new Date(‘yyyy-MM-DD hh:mm’)在ios上的兼容问题
解决:new Date(‘yyyy/MM/DD hh:mm’)
分析:这个问题不只是小程序在ios系统上的问题,只要在ios上运行new Date(‘yyyy-MM-DD hh:mm’)都会出错(invalid date),安卓上没问题。new Date()本身应该没问题于是猜测是字符串格式问题,最有可能是中划线的问题,于是替换为比较常见的斜杠,问题解决。
🏐️CSS相关
伪元素before和after
:before和:after发布于CSS2.1中。
在最初,伪元素的语法是使用“:”(一个冒号)
在CSS3中修订后的伪元素使用“::”(两个冒号),也就是::before 和 ::after—以区分伪元素和伪类(比如:hover,:active等)
无论你使用单冒号还是双冒号,浏览器都将能识别它们(IE8只支持单冒号的格式)。
伪元素实际上并不在文档中生成。它们将在外部可见,但是你将不会在文档的源代码中找到它们,因此,实际上它们是“虚假”的元素。
content属性
:before将会在内容之前“添加”一个元素
:after将会在内容后“添加”一个元素。
在它们之中添加内容我们可以使用content属性。
设置:before和:after时必须设置其content属性,否则伪元素就不起作用
content 属性的值可以为:字符串、attr(attr_name)伪元素的内容跟主元素的某个属性值进行关联,及其内容为主元素的某指定属性的值、url/uri引用外部资源,例如图片、counter()调用计数器,可以不使用列表元素实现序号问题
CSS前缀:-webkit,-ms,-o,-moz
css浏览器的兼容性,有时候我们必须加入-webkit,-ms,-o,-moz这些前缀
Trident内核:主要代表为IE浏览器, 前缀为-ms
Gecko内核:主要代表为Firefox, 前缀为-moz
Presto内核:主要代表为Opera, 前缀为-o
Webkit内核:产要代表为Chrome和Safari, 前缀为-webkit