• CSS 选择器参考手册

    CSS 选择器参考手册

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

    CSS学习 1年前 591 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模板学习 9个月前 537 1
  • 经典CSS聚合

    经典CSS聚合

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

    CSS学习 6个月前 247 0
  • css常用效果总结

    css常用效果总结

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

    CSS学习 6个月前 246 0
  • display: table-cell 无法使用 margin/ padding 的解法

    display: table-cell 无法使用 margin/ padding 的解法

    之前发过一篇,用div+css替代table的文章,因为div+css实在好用。已实际用过display: table的朋友,当你们在使用的时候,也许会碰到「间距调整」的问题,例如要在每一个table-cell裡头设定margin等间距调整,却发现修改无效。假设你碰过这种状况,不妨参考一下我推荐的解法。话不多说,先上个范例!我使用图片+图说当作范例,例子包含:正常状况下,图片紧密排列使用margin调整的结果将宽度写死的结果使用bord...

  • DIV盒子中的float和margin的最详细分析

    DIV盒子中的float和margin的最详细分析

    对于HTMl中的一些小疑惑,在这里进行解析一下。一、div的理解 DIV是基于行,就是一个div占据一行,不会让别的元素,和自己同行。span不是基于行的,就是一个span哪里有空哪里专,不会单独占用一行。二、Float理解Float:Css样式的float浮动属性,用于设置标签对象(如:<div>标签盒子、<span>标签、<a>标签、<em>标签等html标签)的浮动布局DI...

    CSS学习 10个月前 423 0 floatmargin
  • margin设置为什么会失效? 无效情形解析!

    margin设置为什么会失效? 无效情形解析!

    在写代码的时候,常出现各种margin会失效的情况,给定了数值没有任何间距变动!1、inline水平元素的垂直margin是无效的!(这也是常见的)比如:<span>文字文字</span>此时,span是inline水平元素,此时对span进行margin会无效,img等例外的替换元素不算!解决方法:声明下display:inline-black行内块元素,或者换行display:black,此时margin又可...

    CSS学习 12个月前 517 0 margin
  • CSS margin:auto做垂直居中方法

    CSS margin:auto做垂直居中方法

    写过前端的都知道,margin:auto很容易就可以做成水平居中,但要做到垂直居中却不行,这是什么道理,难道margin:auto真的做不到垂直居中吗? 错!!!下面讲解下margin:auto如何做到垂直居中的:方法一:使用writing-mode:vertical-lr + margin:auto垂直居中 虽然垂直居中,但水平居中失败!!!<style>  .father{height: ...

  • CSS 使用margin:0 auto让图片居中方法 display:block+margin:0 auto让图片居中

    CSS 使用margin:0 auto让图片居中方法 display:block+margin:0 auto让图片居中

    应该都知道让一个div元素进行居中,最快的办法就是使用margin:0 auto(前提是div存在定宽值),然后只针对一个图片如何居中呢?为什么对图片直接使用margin:0 auto居中会失败呢?比如: img{width:200px; margin:0 auto;}此时图片不会居中!原因:因为此时图片是inline行内水平元素,就算没有width,其也不会占据整个容器,而maigin...

  • margin:auto学习 - 使用教程

    margin:auto学习 - 使用教程

     本文主要学习一些margin:auto1、元素有时候,就算没有设置width或height,也会自动填充,比如:div{background:#fafafa}会默认margin:auto自动填div满容器2、元素有时候,就算没有设置width或height,也会自动填充对应方式,比如:div{display:absolute;left:0;right:0;background:#fafafa}div的宽度自动填充容器.3、此...

    CSS学习 1年前 475 0 margin
  • margin重叠 - 详细讲解重叠使用情境、方法、重叠条件、规则、案例!

    margin重叠 - 详细讲解重叠使用情境、方法、重叠条件、规则、案例!

     margin重叠通常特性:1、black水平元素(不包括float和absolute元素)2、不考虑writing-mode,只发生在垂直方向(margin-top/margin-bottom)margin重叠三种情境:1、相邻的兄弟元素2、父级和第一个/最后一个子元素3、空的black元素具体:1、相邻兄弟元素margin重叠2、父级和第一个/最后一个子元素重叠(父子共用,父子重叠)父子margin重叠其它必备条件:mar...

    CSS学习 1年前 694 0 margin重叠
  • CSS:margin 一侧定宽自适应布局,取消文字环绕图片的方法

    CSS:margin 一侧定宽自适应布局,取消文字环绕图片的方法

     上一篇文章讲解过一个《padding实现两栏自适应》,今天还是用这个类似的案例,讲解下,在maigin技巧,一侧定宽的自适应布局,避免文字环绕图片的方法!注意:本文分享的方法,是基于margin可以改变无固定width和height的普通black水平元素宽度!首先,看正常环绕的最简单代码:<style>  .box{width: 250px; border: 1px&n...

    CSS学习 1年前 535 0 margin环绕
  • padding和margin负值实现 - 等高布局,侧边栏等高布局方法

    padding和margin负值实现 - 等高布局,侧边栏等高布局方法

    等高布局相关《position实现等高布局》 实现的方法主要是基于position:absolute;top:0;bottom:0来实现等高布局!而本文要使用的方法主要是padding和margin配合等高布局,让多栏目等高!如上图,两侧等高布局,就是使用padding配合margin实现的!<style>  .box{overflow: hidden;resize: vertica...

  • 细说padding与margin:盒模型--宽度和高度

    细说padding与margin:盒模型--宽度和高度

    细说padding与margin盒模型宽度和高度和我们平常所说的物体的宽度和高度理解是不一样的,css内定义的宽(width)和高(height),指的是填充以里的内容范围。因此一个元素实际宽度(盒子的宽度)=左边界+左边框+左填充+内容宽度+右填充+右边框+右边界。元素的高度也是同理。比如:css代码:div{     width:200px;     ...

    CSS学习 1年前 490 0 paddingmargin