CSS

CSS练习-导航栏斜线分隔-利用伪元素

十度 CSS
CSS练习-导航栏斜线分隔-利用伪元素
开始切第一张图了,第一个遇到的问题是顶部导航栏这里,用斜线分割。想到的思路是用伪类:before或者:after实现 先写html结构。 <!-- 导航栏begin --> <div class="header_right fr"> &l...
阅读全文

基于html和CSS3制作酷炫的导航栏

jerry CSS
基于html和CSS3制作酷炫的导航栏
 主要亮点:   1 ul 水平显示   2 li 去掉圆点   3 li中字体水平、竖直居中   4 li控制边框样式   5 使用html + css3 渐变画图 制作背景图片   6 更改颜色透明度   7 DIV制作边框阴影 先看效果图:  

纯CSS+XHTML实现的二级导航菜单效果

jerry CSS
纯CSS+XHTML实现的二级导航菜单效果
本文实例讲述了纯CSS+XHTML实现的二级导航菜单效果。分享给大家供大家参考。具体如下: 这是一款简约、兼容好的XHTML+css二级导航菜单 运行效果截图如下: 在线演示地址如下: http://demo./js/2015/css-xhtml

CSS字体属性全解析

jerry CSS
CSS字体属性全解析
话说CSS字体属性font-family、font-style、font-size、font-weight、font-variant: 使用CSS,可以对字体进行设置,字体属性包括五种常见属性:字体系列font-family、字体样式/字体风格font-style、字体大小font-si

CSS实现的中英文双语菜单效果代码

jerry CSS
CSS实现的中英文双语菜单效果代码
本文实例讲述了CSS实现的中英文双语菜单效果代码。分享给大家供大家参考。具体如下: 这是一款你一定喜欢的CSS中英文双语菜单,支持鼠标 特效,先运行一下看效果,绝对会另你满意。用到了一个背景图片,请自行下载

CSS3制作苹果风格键盘特效

jerry CSS
CSS3制作苹果风格键盘特效
效果预览:   html标签: <!DOCTYPE html><html><head> <meta charset="utf-8" /> <title>CSS3 KeyBoard</title> ...
阅读全文

CSS属性探秘系列(三):line-height

jerry CSS
CSS属性探秘系列(三):line-height
一、line-height的定义 line-height(行高),相邻文本行基线间的距离。那什么是基线呢?对于文字“Benjamin-xx工程师”,来说基线(base line)并不是汉字文字的下端沿,而是英文字母“x”的下端沿。 二、line-heig

CSS属性探秘系列(六):margin

jerry CSS
CSS属性探秘系列(六):margin
一、属性介绍 margin 属性接受任何长度单位,可以是像素、英寸、毫米或 em。可取值:auto 浏览器计算外边距。length 规定以具体单位计的外边距值,比如像素、厘米等。默认值是 0px。% 规定基于父元素的宽度的百分

独行DIV自适应宽度布局CSS实例与应用范围

jerry CSS
独行DIV自适应宽度布局CSS实例与应用范围
  独行DIV自适应宽度布局CSS实例与扩大应用范围DIVCSS5先给大家介绍独立一列自适应宽度,也就是单独一行宽度自适应DIV的布局。通过DIV CSS实例CSS自适应宽度布局方法,再过常见用处介绍充分掌握自适应独占一行一列

DIV+CSS中让布局、背景图片、文字内容居中的方法

jerry CSS
  在DIV CSS布局的页面里,从布局内容到页面里文章文字居中都是非常重要的,而css来设置居中也是非常简单的。   1、首先介绍使用css属性让整体布局的居中:   设置对象的父级内容居中,这里一个页面的为父级