Div+Css教程

Div+Css教程

    CSS中的层分离编程详解

      随着CSS的发展,使用CSS有语义化的命名约定和CSS层的分离,将有助于它的可扩展性,性能的提高和代码的组织管理。  在我前面的文章中讨论很多关于CSS的问题...[阅读全文]

    3lian8分享 2015-08-11

    CentOS下Cobbler的安装和配置教程

      Cobbler是一个快速网络安装linux的服务,而且在经过调整也可以支持网络安装windows。该工具使用python开发,小巧轻便(才15k行python代码),使用简单的命令即...[阅读全文]

    3lian8分享 2015-08-08

    全方位了解CSS3的Regions扩展

    这是一个adobe的提议:css Regions,提供在多个不同元素中排布内容的方法。首先需要为内容容器声明一个flow属性独一无二的字符值,然后通过from()函数和内容的...[阅读全文]

    3lian8分享 2015-08-08

    CSS三角箭头应用实践

      用CSS来制作无图片带箭头的DIV方框(此代码比较适合追求纯代码者)  这类效果也可以用图片背景来实现,代码会更简洁  CSS代码:  CSS Code复制内容到剪...[阅读全文]

    3lian8分享 2015-08-07

    CSS选择器学习攻略

      CSS选择器基本知识  一、基本选择器  序号 选择器 含义  1. * 通用元素选择器,匹配任何元素  2. E 标签选择器,匹配所有使用E标签的元素  3. .i...[阅读全文]

    3lian8分享 2015-08-07

    CSS3中Animation属性的使用详解

      在开始介绍Animation之前我们有必要先来了解一个特殊的东西,那就是”Keyframes”,我们把他叫做“关键帧”,玩过flash的朋友可能对这个...[阅读全文]

    3lian8分享 2015-08-07

    让Div实现水平或垂直居中的相关方法

      先来看一个最普通的实现示例:  创建一个新的html页面,  XML/HTML Code复制内容到剪贴板    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitio...[阅读全文]

    3lian8分享 2015-08-07

    鼠标悬停图片产生边框的效果实现

      HTML  图片的宽高一定要定义  XML/HTML Code复制内容到剪贴板              CSS  CSS Code复制内容到剪贴板  .con {  margin: 50px; ...[阅读全文]

    3lian8分享 2015-08-06

    使用CSS实现文字的竖排的简单方法

      样式表的文字处理属性中有两个重要的属性:writing-mode和text-align。让我们先看看它们的用法:  1. writing-mode(设置对象书写方向)  语法:writing-...[阅读全文]

    3lian8分享 2015-08-06

    CSS的font-size属性及其em值的使用

      定义和用法  font-size 属性可设置字体的尺寸。  说明  该属性设置元素的字体大小。注意,实际上它设置的是字体中字符框的高度;实际的字符字形可能比...[阅读全文]

    3lian8分享 2015-08-06

    利用CSS3的transition属性实现滑动效果

      首先援引一下w3school上的transition基本知识:  定义和用法  transition 属性是一个简写属性,用于设置四个过渡属性:  transition-property  tra...[阅读全文]

    3lian8分享 2015-08-06

    inline-block带来的元素间距问题解决

      display:inline-block:众前端们都知道,其作用是将对象呈递为内联对象,但是对象的内容作为块对象呈递。  有如下代码  CSS Code复制内容到剪贴板    <...[阅读全文]

    3lian8分享 2015-08-05

    CSS3中使用RGBA设置透明度的示例

      说明:  RGBA(R,G,B,A)  取值:  R:红色值。正整数 | 百分数  G:绿色值。正整数 | 百分数  B:蓝色值。正整数 | 百分数  A:Alpha透明度。取...[阅读全文]

    3lian8分享 2015-08-05

    CSS3的RGBA中关于整数和百分比值的转换

    v  如何把整数转换为百分数  前面提到了,使用百分数值代替整数值来表示红、绿、蓝三原色的量,最后得到的结果是相同的。0代表0%,255就表示100%。为了让百...[阅读全文]

    3lian8分享 2015-08-05

    CSS中对RGB颜色的使用详解

      RGB颜色模型解释  RGB颜色模型就是一种描述某个颜色里面有多少红、绿、蓝三原色的量的方法,就像把水彩颜料或油彩颜料混合起来得到某种我们想要的真实色彩...[阅读全文]

    3lian8分享 2015-08-05

    使用CSS伪元素实现文字部分变色的方法

      思路思路很简单,就是一个字写两遍,一个字只显示部分,不过不能真的把一个字写两遍。这里就需要用到CSS伪元素:before和:after,记住这个“伪元素”...[阅读全文]

    3lian8分享 2015-08-05

    详解CSS3中@media的实际使用

      语法:  CSS Code复制内容到剪贴板  @media : { sRules }  取值:  :  指定设备名称。  {sRules}:  样式表定义。  说明:  判断媒介(...[阅读全文]

    3lian8分享 2015-08-05

    CSS3中的clip-path使用攻略

      根据她的以往经验,这个网站的HTML和CSS是完全在她的能力范围以内,于是我帮助她完成了这个效果。显示nav被裁减的效果是一个不简单的任务,我看到图片的第一...[阅读全文]

    3lian8分享 2015-08-04

    使用CSS3实现选项卡切换的方法

    :target是什么?MDN是这样描述的::targetThe :target pseudo-class represents the unique element, if any, with an id matching the fragment identifier of...[阅读全文]

    3lian8分享 2015-08-04

    使用CSS3和Checkbox实现JQuery的一些效果

    show()/hide()的实现show()/hide()的实现主要控制元素的display属性。 html:XML/HTML Code复制内容到剪贴板    <div id="box">    <input type="checkbox" id=...[阅读全文]

    3lian8分享 2015-08-04

    简要总结CSS编程中的响应式设计

      现在,响应式Web设计无疑是非常流行的。对于新人,responsive  design可能听起来有点复杂,但实际上,它比你想的要简单的多。为了帮助你快速入门响应式Web设...[阅读全文]

    3lian8分享 2015-08-04

    CSS3的一个简单导航栏实现

       上面是一个效果图,代码在下面:htmlXML/HTML Code复制内容到剪贴板    <nav>    <ul class="nav-ul">    <li>    <a href="/">首页</a>    </li>    <li>   ...[阅读全文]

    3lian8分享 2015-08-04

    CSS中一些@规则的用法小结

      at-rule是一个声明,为CSS提供执行或怎么表现的指令。每个声明以@开头,后紧跟一个可用的关键字,这个关键字充当一个标识符,用于表示CSS该做什么。这是一个...[阅读全文]

    3lian8分享 2015-07-31

    CSS3的Flexible Boxes详细使用教程

      Flexible  Box是什么?Flexible意为可伸缩的,Box意为盒子,可以理解为一种新式的盒模型——伸缩盒模型。由CSS3规范提出,这是在原有的大家非常熟...[阅读全文]

    3lian8分享 2015-07-30

    使用CSS居中浮动元素的方法

    方法一设置容器的浮动方式为绝对定位 然后确定容器的宽高 比如宽500 高 300 的层 然后设置层的外边距CSS Code复制内容到剪贴板    div{    width:500px;    he...[阅读全文]

    3lian8分享 2015-07-30

    CSS编写规范的相关建议

      避免过度约束  作为一般规则,不添加不必要的约束。  CSS Code复制内容到剪贴板  // 糟糕  ul#someid {..}  .menu#otherid{..}  // 好的  #s...[阅读全文]

    3lian8分享 2015-07-30

    CSS样式编写的简明指南

      代码如下:  [selector]{  [property]:[value];  [<- Declaration ->]  }< p>[选择器]{   [属性]:[值];  [<- 声明 ->]  }  编写 CSS 样式时...[阅读全文]

    3lian8分享 2015-07-30

    CSS注释的一些高级用法

      准修饰选择器(Quasi-qualified selectors)  你应当避免过分修饰选择器,例如如果你能写 .nav{} 就尽量不要写 ul.nav{}。过分修饰选择器将影响性能,影响 ...[阅读全文]

    3lian8分享 2015-07-30

    CSS中的一些百分比相关调试经验分享

      很多css属性的取值都可以是百分比值。虽然形式上来说,百分比值都是数字后跟%的形式(注意数字和%之间不可以有空格),但在不同的使用场合下,其意义会有很多...[阅读全文]

    3lian8分享 2015-07-29

    解析css中的选择符命名

      原来命名可以这样的  前一段时间,在某一站点看到了这样的内容:  "这也可以?"是我对此的第一印象。不过,稍作调查知道了,这样写确实是有效的。此外,...[阅读全文]

    3lian8分享 2015-07-29

    CSS中的选择符实际使用指南

      在我最早开始写css的时候,其代码上的高自由度就一直很令我困惑。这就是说,同一个设计,如果让不同的人来实现,最终的代码一定是有差异的。但这存在一个问...[阅读全文]

    3lian8分享 2015-07-29

    将页脚固定在页面底部的CSS实战

      页脚的位置问题  网页的页脚(footer),也就是通常用来放置帮助链接及版权信息的地方。页脚自然是应该位于页面底部的,但依照一般的做法,如果位于页脚之前...[阅读全文]

    3lian8分享 2015-07-29

    利用SVG和CSS3来实现一个炫酷的边框动画

      今天我们来探索一下Carl Philipe  Brenner的网站上一个微妙而有趣的动画效果。当鼠标经过网格元素时,会有一个微妙的动画发生——网格元素变得透...[阅读全文]

    3lian8分享 2015-07-23

    浅谈CSS中的OOCSS编程方式

      OOCSS即面向对象的CSS,这里对象指的是页面中的元素对象,与传统编程中的面向对象不太相同,比如不存在方法这种东西,硬要说的话,附加的一些class可以看作...[阅读全文]

    3lian8分享 2015-07-23

    详解CSS的DRY编程方式

      DRY就是Donot repeat youself  不要重复。但其实这个名字有点无趣,哪个理论不是消除重复呢,但如何消除才是意义所在。总的来说我认为DRYCSS与OOCSS是两个极...[阅读全文]

    3lian8分享 2015-07-23

    用SMACSS规范来编写CSS

      这是一个相对繁杂的CSS理论,分为Base、Layout、Module、Status和Theme共五个部分。不过它的核心思想仍然和OOCSS类似,鼓励使用class。  1. Base 基本属性...[阅读全文]

    3lian8分享 2015-07-23

    CSS编程中一些值得注意的地方小结

      CSS即层叠样式表,所以一层一层覆盖其实是其本质特征。真正的问题在于维护,许多人认为CSS仅是样式,不是代码,无需维护,所以任意书写,只要将自己需要的样...[阅读全文]

    3lian8分享 2015-07-23

    使用css实现圆角图形绘制

      查看 demo  htmlXML/HTML Code复制内容到剪贴板    <div class="curvedBox">    <span>    <span class="r1"></span>    <span class="r2"></span>    <s...[阅读全文]

    3lian8分享 2015-07-23

    10个CSS简写及优化技巧

      CSS简写就是指将多行的CSS属性简写成一行,又称为CSS代码优化或CSS缩写。CSS简写的最大好处就是能够显著减少CSS文件的大小,优化网站整体性能,更加容易阅读...[阅读全文]

    把我给崩了分享 2015-07-22

    使用Sass来编写面向对象的CSS代码

      自从2008年Nicole Sullivan提出Object-Oriented  CSS(OOCSS)以来。它就成为一个领先的模块系统,用来组织你的CSS代码方式之一。  OOCSS不同于其他组织CSS...[阅读全文]

    3lian8分享 2015-07-22

    使用CSS实现页面复选框的方法

      产品篇  在我们的后台中,需要设置广告精准投放的区域,也就是要在全国31个省、自治区、直辖市中选择。那么,出现下面这幅景象也就理所应当了:  这样做...[阅读全文]

    3lian8分享 2015-07-22

    使用icon fonts来辅助CSS处理图片

      由于移动端设备拥有不同分辨率,PPI 等引起的问题, 常常需要针对不同屏幕分辨率来调整优化,如使用 @2x 图片, max-width  限制等。  采用 css @font-fa...[阅读全文]

    3lian8分享 2015-07-22

    CSS中使用image data URI来处理图片的方法

      即将图片资源转换为 base64 字符串格式嵌到页面或样式中。这样连图片的请求链接都省了。  如:  使用方式  CSS Code复制内容到剪贴板  /** 数据格式...[阅读全文]

    3lian8分享 2015-07-22

    CSS3的media query学习攻略

      一个媒体查询(media query)包含一个媒体类型(media type)和至少一个表达式,用媒体特性限制样式表的作用范围。  语法  媒体查询包含一个媒体类型(media...[阅读全文]

    3lian8分享 2015-07-22

    CSS中的元素定位方法详解

      1.盒模型  盒模型,就是 浏览器为页面中的每个 HTML 元素生成的矩形盒子。  这些盒子们都要按照 可见版式模型(visual formatting model)在页面上排布。...[阅读全文]

    3lian8分享 2015-07-22

页次:2/22 每页45 总数961

    首页  上一页  下一页  尾页    转到: