分类: Css预览模式: 普通 | 列表

CSS常见的让元素水平居中显示方法

用CSS让元素居中显示并不是件很简单的事情—同样的合法CSS居中设置在不同浏览器中的表现行为却各有千秋。让我们先来看一下CSS中常见的几种让元素水平居中显示的方法。

  1.使用自动外边距实现居中

  CSS中首选的让元素水平居中的方法就是使用margin属性—将元素的margin-left和margin-right属性设置为auto即可。在实际使用中,我们可以为这些需要居中的元素创建一个起容器作用的div。需要特别注意的一点就是,必须为该容器指定宽度:

  div#container {

查看更多...

Tags: 居中

分类:Css | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 496

封装个选项卡js

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>井底的蛙</title>
<script type="text/javascript">
/*

查看更多...

分类:Css | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 530
1)多点调用

<html>
<head>
<style>
body
{

查看更多...

Tags: 选项卡

分类:Css | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 682

Javascript仿flash焦点图片效果

HTML代码


[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]

查看更多...

Tags: 焦点图

分类:Css | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 654

用CSS处理图片的宽度

#showimg img{

max-width: 600px;

width:e­xpression_r(this.width > 600 ? "600px" :this.width;

text-align:center;

查看更多...

分类:Css | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 508

css文字竖排效果  

一、用layout-flow
    layout-flow(设置对象书写方向)
  
    语法:layout-flow:vertical-ideographic
    示例:div { layout-flow:vertical-ideographic; }
  
  轻轻的

查看更多...

Tags: 文字 竖排 效果

分类:Css | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 596
提取自ZCMS的弹出层,无外部css文件,引用Dialog.js即可使用,兼容主流浏览器,支持ie6下的阴影和半透明效果,
先看效果图


引用内容 引用内容


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

查看更多...

Tags: 弹出层

分类:Css | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 758

选项卡

一个TAB切换一个Radio切换

特点:
1、同页面可同时存在多个TAB,代码简单;
2、可自定义鼠标事件,onmouseover或onclick;
3、Radio切换可用在特殊需求的表单中。

查看更多...

Tags: 选项卡

分类:Css | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 626

css圆角

HTML代码


[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]

查看更多...

Tags: 圆角

分类:Css | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 630

使两个DIV并成一排

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>

查看更多...

Tags: 一排

分类:Css | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 585