又一个典型css实例_经验交流

复制代码 代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="zh-CN" xml:lang="zh-CN" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" Content="PR,qq:50198763" />
<title>PR</title>
<style type="text/css" media="screen">
<!--
@charset "gb2312";
/* PR css 全局设置 */
body,a,strong,input,button,h1,h2,h3,h4,h5,h6,h7 {font:12px "Arial","宋体","Tahoma","QQ 50198763",sans-serif;}/*12px大,字体优先:Arial,然后:宋体,Tahoma,族科:sans-serif*/
html,body {height:100%;}/*设置浏览器高度为100%*/
body,form,menu,dir,fieldset,blockquote,p,pre,ul,ol,dl,dd,h1,h2,h3,h4,h5,h6 {padding:0;margin:0;}/*设置body,form,menu,dir,fieldset,blockquote,p,pre,ul,ol,dl,dd,h1,h2,h3,h4,h5,h6内外补丁为0*/
div,p {display:block;}/*所有div,p为块元素*/
ul,ol,dl {list-style:none;}/*所有项目符号显示无*/
img {border:0;}/*所有图片边框无*/
a {text-decoration:none;}/*所有链接无修饰[上,下划线,虚线...]*/
a:hover {text-decoration:underline;}/*所有链接鼠标放上时为下划线*/
button {cursor:pointer;}/*所有按钮鼠标放上时为手型标志*/
/* 全局设置完毕 */

/* 布局 */
#box { width:548px; padding-bottom:8px; }
#box h3 { height:17px; padding-top:10px; }
#box .bg { padding:5px 10px 0; }
/* 修饰 */
#box { background:url("images/left-btm.gif") no-repeat center bottom; }
#box h3 { font-weight:bolder; font-size:12px; text-indent:2.5em; background:url("images/left-toptle.gif") no-repeat; }
#box .bg { background:url("images/left-mid.gif") repeat-y; }
-->
</style>
</head>

<body>
<div id="box">
    <h3>小狗无道</h3>
    <div class="bg">
    <p>测试内容</p>
    <p>测试内容</p>
    <p>测试内容</p>
    </div>
</div>
</body>
</html>

下载此文件

时间: 2024-10-25 07:44:23

又一个典型css实例_经验交流的相关文章

css font缩写总结附实例_经验交流

font的缩写,如果省略family, 如这样子: font:700 14px/22px; 则在Firefox下是不生效的 完整的写法是:font:700 14px/22px arial; 我垂直不居中 我垂直居中 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

css Hspace 和vspace的图片控制实例_经验交流

当你觉得图片与文字距离太接近时,就可以使用此属性.  图文间隔:Hspace和 Vspace 的设定  1.水平间隔:HSPACE.  例如:<IMG hspace=10 src="*.gif"> (单位也是用像素(pixel)来计算的.)  2.垂直间隔:VSPACE.  使用方法与 HSPACE 相同,在这里不多作介紹.  例如:<IMG vspace=10 src="*.gif"> (离文字的水平距离,通常多少设一点以免靠文字太近.) 

不错的10个你未必知道的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 

不错的整理的24则css技巧_经验交流

虽然在许多的文档中,多次提及过这方面的内容,但依然有很多朋友在这些问题上犯错.我们今天看看这些CSS技巧,认真读一读,或许您并不能完全理解,您可以进行搜索,扩展您所想要得到的知识,相信您会有很多收获!  一.ul标签在Mozilla中默认是有padding值的,而在IE中只有margin有值.  二.同一个的class选择符可以在一个文档中重复出现,而id选择符却只能出现一次.对一个标签同时使用class和id进行CSS定义,如果定义有重复,id选择符做的定义有效,是因为id的权重要比class

css强制换行 css强制不换行的css方法_经验交流

以前总结过Div的换行和不换行的css写法.但对于表格单元格只知道一个属性nowrap可以使其不换行. 近日有此需要,但发现加上nowrap在某些情况下还是会换行!无奈,没有一个强制不换行的方法吗? baidu了一下,令俺非常欣慰,还真的找到了办法,问题解决了. 用CSS实现表格单元格数据自动换行或不换行 1.自动换行: 自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行

巧妙地使用CSS选择器_经验交流

可以通过不同规则来定义不同内容块里的链接样式.类似这样:#nav a:link或者 #main a:link或者#footer a:link.也可以定义不同内容块中相同元素的样式不一样.例如,通过#main p和#sider p分别定义#main p和#sider p的样式.从结构上讲,你的页面是由图片.链接.列表.段落等组成的,这些元素本身并不会对显示在什么网络 设备中(PDA还是手机或者网络电视)有影响,它们可以被定义为任何的表现外观.  一个仔细结构化的HTML页面非常简单,每一个元素都被

CSS锦囊_经验交流

翻译:onestab [2004.03.09]原文:mezzoblue CSS Crib Sheet 在使用CSS建站时,您肯定遇到过形形色色的布局问题,最后可能被搞得焦头烂额.本文的目的是让您的设计过程更为容易,当您遇到困难时为您提供快速参考. 如果您有所补充,请在这里发表您的意见. 本文的其他语言版:法语, 德语, 西班牙语 和 匈牙利语. 欢迎提供其他翻译. 有疑问,先验证    在调试时,先对您的代码进行验证往往能省去不少麻烦事.格式不正确的XHTML/CSS 会导致许多布局上的错误.

学习样式表CSS参考-常用的CSS知识_经验交流

1. Block和inline元素对比 所有的HTML元素都属于block和inline之一. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div>, <p>, <h1>, <form>, <ul> 和 <li>是块元素的例子. 相反地,inline元素的特点是: 和其他元素都在一行上: 高,行高及顶和底边距不可改变: 宽度就是它的文字或图片的宽度

让人不得不佩服的CSS效果_经验交流

作者:eoe1.寻寻觅觅先要找个到好效果~才能抄如http://www.cssplay.co.uk/ http://www.cssbeauty.com 等都能常常看到 今天不小心路过cssplayhttp://www.cssplay.co.uk/ menus/magnifier2.html好像好好玩滴样子 自己开起topstyle来试一下建议大家看到好玩的样式~不要急着看他的CSS~没意义 2.自己动手~丰衣足食<!DOCTYPE html PUBLIC "-//W3C//DTD XHTM