• CSS 选择器参考手册

    CSS 选择器参考手册

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

    CSS学习 5个月前 271 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(...

  • CSS,中间文字 两边横线 CSS样式写法

    CSS,中间文字 两边横线 CSS样式写法

    在项目中遇到过中间文字,两边横线的布局,如下图:两边横线我们可以使用标签的上边框或者下边框,然后对中间的文字使用 vertical-align 属性来控制。<div class="order">      <span style="white-space:pre">  &n...

    CSS学习 5天前 37 0 横线
  • CSS 贯穿文字一条横线(类似删除线)

    CSS 贯穿文字一条横线(类似删除线)

    要在文字中间实现有一条横线的效果可以使用CSS中CSS text-decoration 属性就可以达到效果。CSS text-decoration 属性相关介绍及事例:浏览器支持:所有主流浏览器都支持 text-decoration 属性。定义、用法和说明:text-decoration 属性规定添加到文本的修饰。CSS text-decoration 属性的值:A、none    默认。定义标准的文本。B...

    CSS学习 5天前 25 0 横线
  • DIV盒子中的float和margin的最详细分析

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

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

    CSS学习 2周前 34 0 floatmargin
  • 使用float和inline-block可以让两个div处于一行存在

    使用float和inline-block可以让两个div处于一行存在

    来分享一个关于div布局的基础知识,今天写一个zblog模板的时候贸然遇到了一个div的float问题,通过百度寻找方法,大多都是此类最基础的,没有发现自己想要的。我们知道 div是 块级 元素,是 独占一行 的.一般情况下,两个相邻的div是不会处于一行的例如:<!DOCTYPE html><html><head lang="en&qu...

    CSS学习 2周前 41 0 floatdisplay
  • CSS 图片触发显示特效,线条动态

    CSS 图片触发显示特效,线条动态

     前两天接了一个zblog主题定制,其中分类列表中的图片都需要如上图的特效,在鼠标触发文章缩略图时候,会悬浮显示一层特效,线条动态显示,下面记录下这段HTML和CSS:首先是HTML:<div class="list"> <ul> <li> <div class="img">   <a&...

  • CSS3 经典教程系列:CSS3 线性渐变(linear-gradient)

    CSS3 经典教程系列:CSS3 线性渐变(linear-gradient)

    CSS3 Gradient 分为 linear-gradient(线性渐变)和 radial-gradient(径向渐变)。而我们今天主要是针对线性渐变来剖析其具体的用法。为了更好的应用 CSS3 Gradient,我们需要先了解一下目前的几种现代浏览器的内核,主要有 Mozilla(Firefox,Flock等)、WebKit(Safari、Chrome等)、Opera(Opera浏览器)、Trident(讨厌的IE浏览器)。  本文...

  • CSS 怎么清除多个a标签之间的默认空白空隙/间距?

    CSS 怎么清除多个a标签之间的默认空白空隙/间距?

    今天来分享下如何清除掉多个a标签之间的默认空白空隙。关于清除各种默认空隙,之前发布过2篇,分别是:1、《两个input input与button之间有空隙清除》2、《 《:last-child》清除列表中最后的空隙》关于a标签的空隙,在今天实际使用中发现之前竟然从未想过,也基本不会用到,各种a标签肯定要使用margin进行间距设置而不是默认的堆放再一起。但刚才在写一个页码的时候,要使多个a链接页码保持紧贴,竟然发现有很大的空隙!先看要实...

    CSS学习 2个月前 184 0 间距
  • 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学习 2个月前 331 6 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学习 2个月前 146 0 图片居中居中