前端技术 第5页
  • CSS 选择器参考手册

    CSS 选择器参考手册

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

    CSS学习 3年前 1135 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模板学习 2年前 1193 1
  • 经典CSS聚合

    经典CSS聚合

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

    CSS学习 2年前 673 0
  • css常用效果总结

    css常用效果总结

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

    CSS学习 2年前 702 0
  • jQuery - ScrollUpBar Plugin插件,滚动隐藏/回滚显示

    jQuery - ScrollUpBar Plugin插件,滚动隐藏/回滚显示

     上一篇文章分享了《jQuery - 下拉滚动隐藏/回滚显示 - 特效代码》,本文再次分享一种实现的jQuery插件,ScrollUpBar Plugin插件,可以滚动隐藏和回滚、滚动显示!代码分享:<!doctype html> <html> <head> <meta charset="utf-8"> <title>滚...

  • jQuery - 下拉滚动隐藏/回滚显示 - 特效代码

    jQuery - 下拉滚动隐藏/回滚显示 - 特效代码

     最近写一个zblogPHP主题,需要用到滚动的时候隐藏菜单,而启动回滚的时候置顶显示这个菜单,如图:这个jQuery特效非常好用,兼容性也比较好!分享滚动隐藏测试代码:<!doctype html> <html> <head> <meta charset="utf-8"> <title>滚动隐藏,回滚显示</ti...

  • jQuery瀑布流插件 - Masonry瀑布流特效代码分享

    jQuery瀑布流插件 - Masonry瀑布流特效代码分享

    今天接一个zblogPHP模板修改,使主题首页、分类列表支持瀑布流显示,如下图:下面来分享下jQuery插件Masonry实现瀑布流的方法:1、分别下载 jQuery 与 Masonry ,然后把他们都加载到页面中使用。<script src="http://www.yzktw.com.cn/zb_system/script/jquery-2.2.4.min.js"></script>...

    js/jQuery 2年前 573 0 瀑布流
  • 使用CSS实现三栏自适应布局(两边宽度固定,中间自适应)

    使用CSS实现三栏自适应布局(两边宽度固定,中间自适应)

    所谓三列自适应布局指的是两边定宽,中间block宽度自适应。这道题在今年网易内推前端工程师面试的时候也被问到。 我这里主要分为两大类,一类是基于position传统的实现,一类是基于css3新特性弹性盒模型布局实现。一、基于传统的position和margin等属性进行布局这里也分为三种方法,分别为绝对定位法,圣杯布局,自身浮动法。1).绝对定位法绝对定位法原理是将左右两边使用absolute定位,因为绝对定位使其脱离文档流,后面的ce...

    CSS学习 2年前 491 0 中间自适应
  • css隐藏文字的5个方法

    css隐藏文字的5个方法

    通过CSS隐藏一段文字,甚至隐藏一段HTML都是经常需要用到的,不管是暂时不需要的模块或者当前窗口宽度不足的自适应,都几乎必须用到CSS隐藏!今天就来分享5个关于如何去通过CSS隐藏文字或者HTML:1、display: none;display: none几乎是每一个学会CSS基础的人都喜欢用的隐藏方法,这种方法简单暴力,但其实使用display: none进行隐藏,也会隐藏掉隐藏对象原有的占位空间,消失了无痕迹!2、visibili...

    CSS学习 2年前 620 0 隐藏
  • CSS修改swiper幻灯片 - 状态圆点变长条修改

    CSS修改swiper幻灯片 - 状态圆点变长条修改

     在之前发布过关于swiper的文章《swiper幻灯片自定义切换三角特效》主要分享的是切换按钮的特效CSS,本文来介绍下swiper幻灯片插件的状态圆点样式改变!因为swiper幻灯插件都有默认的CSS,所以要添加CSS的时候是覆盖添加,添加的一定要显示在swiper自带CSS的下方方可生效!swiper默认的状态圆点状态图:要最终实现的效果如下:只需要改变和覆盖CSS样式即可:使用google chrome右键检查,获知....

  • CSS 中间文字、两侧居中横线(使用伪类before,after)

    CSS 中间文字、两侧居中横线(使用伪类before,after)

    中间文字 两边横线 CSS样式写法两边文字、中间横线的CSS写法本文再介绍一种关于文字与横线的关系,中间文字,两侧横线,主要方法:CSS伪类before,after制作左右横线中间文字效果HTML:<div class="container">     <h3 class="title">Welcome&nb...

    CSS学习 2年前 987 0
  • 两边文字、中间横线的CSS写法

    两边文字、中间横线的CSS写法

    关于文字与横线之间的关系,之前写过一篇:CSS,中间文字 两边横线 CSS样式写法 如上图,本文要分享的是两边文字、中间横线的CSS写法,比较简单:HTML:<div class="title">    <span class="name"><i class="iconfont ...

    CSS学习 2年前 785 0 横线
  • CSS修改swiper幻灯片自定义切换剪头特效(背景图、位置、背景色、尺寸)

    CSS修改swiper幻灯片自定义切换剪头特效(背景图、位置、背景色、尺寸)

    《zblog模板最好用的幻灯片(轮播、焦点图)特效代码》之前发布的幻灯片特效,推荐SuperSlide和swiper,今天来分享下老白常用的swiper自定义特效,包括切换大于号小于号,包括幻灯片文字标题:先看默认状态下的swiper幻灯片特效:一、改变剪头背景图片:其中左右切换三角都是使用背景图片制作的,而下方图片则是通过增加CSS去改变背景图片,以及切换圆点特效:CSS:/*slider*/ #slider{width:&nb...

  • CSS 多行文本最后省略号“...” /多行文本最后一行超出的部分隐藏并显示省略号的方法

    CSS 多行文本最后省略号“...” /多行文本最后一行超出的部分隐藏并显示省略号的方法

    网上很多的解决方法是针对一行超出部分,隐藏并显示省略号的,代码如下:overflow:hidden; white-space:norwrap; text-overflow:hidden;针对webkit浏览器,多行显示时可以通过以下css代码实现,但对于非webkit浏览器,这种写法没有效了。display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-or...

    CSS学习 2年前 705 0 省略号