热门标签： c c# c++ asp asp.net linux php jsp java vb Python Ruby mysql sql access Sqlite sqlserver delphi javascript Oracle ajax wap mssql html css flash flex dreamweaver xml

最新文章 : css

Web开发第二部分 CSS基础（二） CSS书写规范

1、三种不同的样式表
样式表根据其书写位置不同，共分为三种：
内联样式表（inline）：该样式表写在标签的style属性里，负责设置当前标签的样式；
内部样式表（inner）：该样式表一般写在head标签的style标签里，通过选择器来指定某个样式所影响的标签；
外部样式表（external）：该样式表一般写在独立的*.css文件里，通过选择器来指定某个样式所影响的标签，在head标签通过link标签引入外部样式文件；
看一个例子，共两个文件，在同一个目录中：
index.html
<!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=gb2312" />


<link type="text/css" rel="stylesheet" href="style.css" mce_href="style.css" />


<mce:style type="text/css" ><!--

b { /* 这是一个标签选择器 */
background-color:#B0D1E6;
color:bl ......

css：浮动的理解。

css默认的布局是将元素一个一个地往下排列下来，如果不采取浮动，将导致页面非常长。
下面我们通过做一个常见的网站布局，来说明浮动是怎么一回事。
希望的效果是:
步骤一、先把代码写一下，
例：
html内容：
<body >

<div id="head">
head
</div>
<div id="content">
content
</div>
<div id="sidebar">
sidebar
</div>
<div id="footer">
footer
</div>
<p>要多写几行字</p>
</body >
css内容：
body
{
margin:0;
border:0;
}
#head
{
width: 300px;
height:50px;
margin:10;
border:1px solid #000;
background: #0aa;
}
#content
{
width: 200px;
height:80px;
margin:10;
border:1px solid #000;
background: #aa0;
}
#sidebar
{
width: 100px;
height:80px;
margin:10;
border:1px solid #000;
background: #afa;
}
#footer
{
width: 300px;
height:50px;
margin:10;
border:1px solid #000;
background: #0aa; ......

CSS: margin,padding详解

About Box Model:
一个块级元素由content, padding, background, border, margin五个部分组成. 立体图1如下:

平面图如下:

根据以上两图, 相信大家对于Box model会有个直观的认识.
以下说明margin和padding属性:

1. Margin: 包括margin-top, margin-right, margin-bottom, margin-left, 控制块级元素之间的距离, 它们是透明不可见的,

如果上右下左margin值均为40px, 则代码为:
margin-top: 40px;
margin-right: 40px;
margin-bottom: 40px;
margin-left: 40px;

根据上, 右, 下, 左的顺时针规则, 简写为
margin: 40px 40px 40px 40px;

当上下, 左右margin值分别一致, 可简写为:
margin: 40px 40px;
前一个40px代表上下margin值, 后一个40px代表左右margin值.
当上下左右margin值均一致, 可简写为:
margin: 40px;

2. Padding: 包括padding-top, padding-right, padding-bottom, padding-left, 控制块级元素内部, content与border之间的距离, 其代码与margin属性的写法比较类似.
至此, 已经基本了解margin和padding属性的基本用法. 但是 ......

Css 同比例缩小图片

/*控制图片的大小*/
.contentimg{
max-width:600px;
/*max-height:100px;*/
}
*html.contentimg{
width:expression(this.width>50&&this.width>this.height?60:auto);
/*height:expresion(this.height>50?50:auto);
*/
}
调用
$("#"+id.substring(0,id.length-5)+"arCon").html(msg);
                                   $("div.arCon img").each(function(){
                                        $(this).addClass("contentimg");
                             &nbs ......

CSS经典技巧十则

1.CSS字体属性简写规则一般用CSS设定字体属性是这样做的：
font-weight:bold;
font-style:italic;
font-varient:small-caps;
font-size:1em;
line-height:1.5em;
font-family:verdana,sans-serif;
但也可以把它们全部写到一行上去：
font: bold italic small-caps 1em/1.5em verdana,sans-serif;
真不错！只有一点要提醒的：这种简写方法只有在同时指定font-size和font-family属性时才起作用。而且，如果你没有设定font-weight, font-style, 以及 font-varient ，他们会使用缺省值，这点要记上。
2. 同时使用两个类
一般只能给一个元素设定一个类（Class），但这并不意味着不能用两个。事实上，你可以这样：
<p class=”text side”>…</p>
同时给P元素两个类，中间用空格格开，这样所有text和side两个类的属性都会加到P元素上来。如果它们两个类中的属性有冲突的话，后设置的起作用，即在CSS文件中放在后面的类的属性起作用。
补充：对于一个ID，不能这样写<p id=”text side”>…</p>也不能这样写
3. CSS border ......

css margin的相关属性，问题及应用

用float时发现margin不起作用，图片和文字并排时老是不能对齐，于是搜到了这篇文章。 -------------------------------------------------------------------------------------------------------------------- 原创文章，转载请注明来自张鑫旭-鑫空间-鑫生活[http://www.zhangxinxu.com] 本文地址：http://www.zhangxinxu.com/wordpress/?p=48 引言：margin为css中非常常用的一个属性，其所包含的内容也是很多的。本文主要分三部分对margin做一些分析叙述，包括其属性，使用过程中会遇到的问题，以及一些高级应用等。对于JavaScript与margin的控制表达这里不叙述。一、margin相关属性
margin 属性是用于在一个声明中设置四个外边距的所有属性的简写属性。没有继承性，也就是它的设置的margin值不会自动传递到下一级标签中。
margin后面的参数个数可以是一个，两个，三个或四个。
一个参数，例如：margin:10px;表示四边外边距10像素；
两个参数，例如：margin:10px 5px;表示上下外边距10像素，左右外边距5像素；
三个参数，例如：margin:10px 5px 2px;表示上外边距10像素，左右边距5像素，下边距2像素；
四个参数，例如：margin:1 ......