2017年6月
  • CSS 选择器参考手册

    CSS 选择器参考手册

    CSS3 选择器 <script> $(document).ready(function(){ $("botton").click(function(){ //jQuery 元素选择器 $(this).hide(); $("p").hide(); $("#test").hide();...

    CSS学习 1年前 842 0
  • jQuery修改class属性和CSS样式

    jQuery修改class属性和CSS样式

    class属性修改  类属性即class属性,规定类名.  用类选择器规定样式的时候,需要为元素指定类名,即class属性的值.  注意每个HTML元素只有一个class属性.但是class属性的值可以是多个名称,即可能包含一个词的列表,中间用空格分隔.  具体使用方法见:http://www.w3school.com.cn/css/css_selector_class.asp   用jQuery进行类名修改既可以用attr(...

  • zblogPHP模板制作技巧总结

    zblogPHP模板制作技巧总结

    判断:常用if判断 (CMS首页判断、侧栏判断)指定分类设置特殊模板样式,分类编辑选择为某些分类指定分类模板,后台版方法字段:主题调用指定字段文章(多选字段)方法 调用某篇文章:指定文章标题、内容、摘要、图片...调取某个页面的标题、内容等zblogPHP 调用全部页面(调取所有页面) 调用多篇文章:主题连续调用多篇文章,输入ID方法调取置顶文章到首页,限制(指定)N条数 调用某个(单个)分类:调用(指定)...

    zblog模板学习 11个月前 790 1
  • 经典CSS聚合

    经典CSS聚合

    CSS3 线性渐变(linear-gradient)transition过渡效果(变形、变色、旋转、停顿时间)鼠标移上去,图片会自动原地放大CSS写法三角形对话框(带边框)- :before + :after + border从table转而使用div+cssdisplay: table-cell 无法使用 margin/ padding 的解法纯CSS写三角形,自适应不同宽度水平翻转、垂直翻转 触发变色/随机颜色:手机浏览器...

    CSS学习 9个月前 393 0
  • css常用效果总结

    css常用效果总结

    css有不少常用的效果,你在平时浏览网站的时候可能会看到,但是真的要自己写的时候,有时候会突然忘记,今天稍微对那些常见的效果做一下小结。1、每逢大的灾难的时候,很多网站变成了灰色,如何让网站快速变灰?css代码是很简单的,用的是css的filter功能。代码如下:html {    filter: grayscale(100%);//IE浏览器   -webkit...

    CSS学习 8个月前 421 0
  • zblogPHP模板-仿新百家(自适应) - ydbaijia更新优化

    zblogPHP模板-仿新百家(自适应) - ydbaijia更新优化

    这个仿最新百度百家的模板上线已经一周多了,其实更新改版了两三次,只是没有再本博进行更新说明!再最初写的时候,对于IE9的兼容性有些问题,这次进行了修复,以及手机端的错位问题!更新:20170628:1、优化:主题配色调整2、优化:侧栏评论CSS修正3、手机端视频尺寸修正4、优化:IE9下图片边框问题20170628:1、优化:手机端标题2、优化:iphone设备搜索宽度20170621:1、修复手机端标题显示问题2、修复搜索结果页面图片...

    zblog模板更新 1年前 907 0 ydbaijia
  • CSS3 object-fit理解 以及object-fit的兼容性,包括兼容IE9+浏览器

    CSS3 object-fit理解 以及object-fit的兼容性,包括兼容IE9+浏览器

    本文还是着重讲下object-fit:cover,特别是关于object-fit:cover的兼容性问题,如何去兼容更多浏览器。具体的object-fit:cover用法请看《object-fit:cover 剪裁图片尺寸适配div - 居中并裁剪图片》下面简单讲述下object-fit的含义以及如何提高兼容性,比如兼容IE!object-fit理解CSS3 background-size出现的比较早,大家应该知道其支持的一些...

    CSS学习 1年前 3086 12 object-fit
  • CSS3 object-fit:cover 剪裁图片尺寸适配div - 居中并裁剪图片

    CSS3 object-fit:cover 剪裁图片尺寸适配div - 居中并裁剪图片

    最近关注的图片居中比较多,各种各样的图片居中方法,比如上一篇讲的《任意图片在div里的上下垂直都居中!》、《CSS 图片水平垂直全部居中(图片尺寸小于块级父元素)》今天来分享另一种最佳最完美的居中自动剪裁图片的功能,虽然IE8无法做到,但现在IE8还需要考虑吗? 放弃吧,直接使用 object-fit: cover;  !你还记得通过设置图片的 background-size 属性可以解决很多问题的时刻吗?...

  • 图片居中:任意图片在div里的上下垂直都居中!

    图片居中:任意图片在div里的上下垂直都居中!

    任意一个图片,在div中都居中显示,这是比较常用的CSS,很多刚学习的新手却并不知道!<style type="text/css">     div{ border:1px solid #ccc;      height:500px; width:500p...

  • CSS 背景图片铺满浏览器,任何情况下都铺面整个浏览器

    CSS 背景图片铺满浏览器,任何情况下都铺面整个浏览器

    CSS 背景图片铺满浏览器,拖动、上下拉背景图片不出界,下面分享下CSS:<!doctype html> <html> <head> <meta charset="utf-8"> <title>CSS 背景图片铺满浏览器,任何情况下都铺面整个浏览器</title> </head> <bo...

    CSS学习 1年前 841 0 背景图片
  • zblogPHP 阅读数 随机显示

    zblogPHP 阅读数 随机显示

    已经遇到不少使用zblogPHP的用户想让自己的新博新文章看起来有人气,想修改阅读数字,以随机显示!今天就来分享一个最简单的随机显示阅读数字吧,最简单!{php}$temp=rand(1000,9999);{/php}{$temp}记住这段代码,这就是随机显示的代码!其中1000,9999代表随机显示数字在1000-9000,可以任意修改!以上这段代码又显示在何处呢?  文章列表、文章页zblogPHP模板的文章列表一般为:p...

    zblog模板学习 1年前 712 0 随机
  • jQuery滚动导航跟随(锚点定位切换)

    jQuery滚动导航跟随(锚点定位切换)

     关于使用jquery导航跟随置顶的插件,在之前已经分享过几个了:1、jQuery 导航菜单、广告 —— 固定、置顶、跟随2、jQuery 智能判断跟随页面滚动的导航、菜单、广告,下拉后跟随置顶特效代码3、jQuery - 多个菜单导航滚动跟随,全部积累固定在顶端4、jquery 滚动跟随 到达底部时会停止跟随特效代码而今天要分享的,是带锚点定位自动跟随!这是一个插件,所以JS:nav.zip<!DOCTYPE ...

    js/jQuery 1年前 1381 0 滚动跟随锚点
  • jquery Tab选项卡切换插件推荐

    jquery Tab选项卡切换插件推荐

    tab选项卡是很多网站的必须,但对于很多比较懒或者对于JS不太熟悉的同学来说,要写一个tab选项卡切换并不太乐意,干脆使用各种成熟的插件来的比较快! 而且以前所担心的带宽而去不断压缩代码,在硬件不断升级的今天也不再是首要考虑要素! 所以各种tab选项卡切换特效插件层出不穷!今天就为大家介绍几款jquery Tab选项卡切换插件:1、Tabslet – jQuery Tab选项卡插件 - 拥有各种切换和加载特效,比较丰富,所以作为推荐第一...

    js/jQuery 1年前 880 0 选项卡
  • jQuery 选项卡切换特效代码(点击切换)

    jQuery 选项卡切换特效代码(点击切换)

     之前使用选项卡切换,喜欢用各种小插件,也许是因为封装的比较好,但也有不少前端不喜欢插件,喜欢自己写原始JS,或者使用jquery写选项卡切换功能!今天就不分享选项卡切换的插件了,就分享个如上图的jquery选项卡切换简单特效:<!DOCTYPE html> <html> <head> <meta charset="utf8"&...

    js/jQuery 1年前 688 0 选项卡
  • 认识CSS3 :only-child 选择器和使用方法

    认识CSS3 :only-child 选择器和使用方法

     定义和用法:only-child 选择器匹配属于其父元素的唯一子元素的每个元素。所有主流浏览器均支持 :only-child 选择器,除了 IE8 及更早的版本。案例:案例一:规定属于其父元素的唯一子元素的每个 p 元素:p:only-child{background:#ff0000;}<!DOCTYPE html> <html> <head> <style>&...