小梦子 发布的文章
-
浅谈css3的混合模式
在photoshop中，我们处理图片，在图层之间有混合模式，点击混合模式里面的选项，可以使图片实现不同的效果，这个混合模式在css3中也有实现！下面就来介绍一下css3的混合模式。css3的混合模式主要使用mix-blend-mode这个属性来实现的。当然，也可以用background-blend-mode。下面我就来介绍一下这2个属性吧！ mix-blend-mode 这个用法很简单，就是在你需要混合的div上面添加这个属性就可以了，例如如下： mix-blend-mode: multiply; multiply，这个就是我们ps中的正片叠底！ 类似的属性我列举一下......
-
关于position:sticky的使用
前段时间做的一个项目中有要求导航随页面滚动然后固定在窗口的某个位置（下面简称粘性布局），所以本文主要介绍 position:sticky 实现的粘性布局；链接在此； 为了实现这种粘性布局我们一般都是通过js监听window的scroll事件，当需要固定的元素滚动到窗口顶部时，把元素的position属性设置为fixed，否则，取消fixed，简单的js代码如下： $(window).scroll(function () { var top = $(window).scrollTop(); if (top >= nav_top) { ......
-
重温css的选择器
本文主要和大家重温一下css选择器中的一些常用符号的使用，例如“+、~、^、$、>、*”等的使用！ css选择器之特殊符号 1、>(大于号) 大于号代表选择子元素，这个我们经常用，值得注意的是 div>span 和div span 的区别 这2个都是选择子元素，但是 div>span 只选择某个元素的子元素。例如如下： <div>This is <span class="aa">very</span > <span>very</span> important.</div&......
-
关于移动端垂直居中对齐的几个方法
在移动前端制作中，我们会遇到垂直水平居中问题，下面介绍几种css3方法来解决； 1、CSS3的transform:translate 需要注意的是，这种写法会和其他transform样式有冲突，在某些情况下边缘和字体渲染会有问题 css .center{ width:50%; position: absolute; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webki......
-
记使用新模板语言踩的坑
最近有个项目是用新cms语言来做的，因为是第一次使用，所以总会遇到一些小问题，在这里跟大家分享下。链接在此； 1、在使用新CMS模板语言之前记得安装cms插件 2、在发布系统添加新项目时，CMS类型记得勾选“是”，否则该项目就是普通项目，不会同步东西到CMS那边； 3、在项目中，include要用相对路径（否则在发布系统发布不了，会报错）。比如： global_include/config.html 4、使用新CMS模板语言的项目在发布系统发布后，会在六马系统自动生成相对应的模板和相对应的页面。 在项目中，我们需要在cms_config.js这个文件配置相对应的页面信息。如下......
-
分享几个在开发中遇到的一些小问题
1、修改chrome记住密码后自动填充表单的黄色背景 主要通过input : -webkit-autofill来进行修改！ input:-webkit-autofill { background-color: #FAFFBD; background-image: none; color: #000; } 2、修改输入框placeholder文字默认颜色-webkit-input-placeholder input标签的placeholder 属性我们都常用到，它用来显示提示信息。提示会在输入字段为空时显示，并会在字段获得焦点时消失。这很好用。但placeholder 属性对于的样......
-
关于嵌套新闻发布系统的一些事
本文主要总结嵌套新闻发布系统遇到的一些问题及解决方法！ 一、移动端-新闻内页中嵌套新闻列表页 如下图，在该新闻内页里面还需要嵌套新闻列表页，并且两者都需要加载更多翻页功能 所以，在这种情况下，内嵌的列表页需要用ajax获取并且实现翻页加载更多功能，链接在此； var _nextHostList="http://stzb.test.nie.163.com/m/qyz/news_list", _nextHost="", _totalPagesList=1, _totalPages=1......
