`
dahui
  • 浏览: 50154 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

我的CSS (2)

阅读更多


1) 定义一个靠右对其的图片。关键是靠右,以及padding-right: 8px
.boxHeader{
 background-image: url(../img/blue_top_900x27.png);
 background-repeat: no-repeat;
 background-x-position: right;
 background-y-position: top;
 background-color: #e8e8e8;
 padding-right: 8px;
 background-attachment: scroll;
 background-position: right top;
}

2) 定义一个靠左的图片。关键是margin-right的设置。
.boxHeaderTitle {
 background-color: transparent;
 background-repeat: no-repeat;
 padding-top: 5px; 5px; 5px; 10px;
 background-image: url(../img/blue_top_900x27.png);
 padding-left: 10px;
 margin-right: 10px;
 background-position: left top;
 font-size: 120%;
 font-weight: bold;
 color: #FFFFFF;
 padding-bottom: 2px;
}

3) 画出一个带边框而已。火狐下是圆角的。
.boxContent {
 -moz-border-radius-bottomleft:6px;
 -moz-border-radius-bottomright:6px;
 background-image: none;
 padding-top: 6px;
 padding-right: 10px;
 padding-bottom: 8px;
 padding-left: 10px;
 border-width: 0px 1px 1px 1px;
 border-style: solid;
 border-color: #dddddd;
}

感觉: 可以把CSS当作一种编程语言。当然,它的目标是布局、色彩。
分享到:
评论

相关推荐

    css3.0参考手册 css3.0参考手册

    css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css...

    css(2),css(2)

    css,css,css,css,css,css,css,css,css

    CSS CSS CSS

    CSS CSS 资料套装 CSS CSS 资料套装 CSS CSS 资料套装 CSS CSS 资料套装 CSS CSS 资料套装 CSS CSS 资料套装 CSS CSS 资料套装

    CSS2 (Chinese).zip

    本规范定义了第2级层叠样式表(CSS2)。CSS2是一种样式表语言,作者和用户可以使用它将样式(如:字体,间距及语音提示等)附加到结构化的文档(如:HTML文档和XML应用)中。由于CSS2将文档呈现的样式和文档的内容...

    svg转css,css转svg,svg与css互相转换并压缩

    例如,`svg2css`项目(对应压缩包中的`svg2css-master`)可能就是一个这样的工具,它可以帮助开发者实现SVG和CSS之间的转换。这个工具可能包含解析SVG文件,将其转换为CSS,同时也可以逆向操作,将CSS背景图像解码为...

    Reset_CSS css样式重置文件

    CSS重设就是由于各种浏览器解释CSS样式的初始值有所不同,导致设计师在没有定义某个CSS属性时,不同的浏览器会按照自己的默认值来为没有定义的样式赋值,所以我们要先定义好一些CSS样式,来让所有浏览器都按照同样的...

    前端开源库-postcss-css-variables

    2. **响应式设计**:CSS Variables可用于创建响应式设计,根据屏幕尺寸或设备特性改变样式。 3. **组件化**:在组件库中,定义一组共享的CSS Variables,可以方便地调整组件样式。 总结来说,Postcss-css-variables...

    CSS特效+CSS图标

    CSS特效+CSS图标CSS特效+CSS图标CSS特效+CSS图标CSS特效+CSS图标CSS特效+CSS图标CSS特效+CSS图标CSS特效+CSS图标CSS特效+CSS图标CSS特效+CSS图标CSS特效+CSS图标CSS特效+CSS图标CSS特效+CSS图标CSS特效+CSS图标CSS...

    CSS中常用的 reset.css文件

    2. `body{font-size:100%;}`:设置body元素的字体大小为相对于父元素的100%,使得字体大小计算更准确。 3. `h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,blockquote,pre,form,fieldset,legend,textarea,input,button,...

    CSS样式重写.css

    CSS样式重写.cssCSS样式重写.cssCSS样式重写.cssCSS样式重写.cssCSS样式重写.cssCSS样式重写.css

    html+css模板 我的家乡有模板

    【标题】"html+css模板 我的家乡有模板"所代表的知识点主要涉及网页设计领域,特别是HTML和CSS的应用。HTML(HyperText Markup Language)是网页内容的结构标准,而CSS(Cascading Style Sheets)则用于定义这些内容...

    div+css例子 div+css例子

    div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子...

    CSS酷站CSS特效华丽CSS

    2. **CSS动画**:利用`@keyframes`定义动画帧,结合`animation`属性,实现元素的动态效果,如淡入淡出、滑动等。 3. **Flexbox布局**:通过设置`display: flex`,可以轻松实现一行或多行弹性布局,自动调整元素的...

    邮件css web css 手机css!

    邮件css web css 手机css!邮件css web css 手机css!邮件css web css 手机css!

    css自动换行 css自动换行 css自动换行

    css自动换行css自动换行css自动换行css自动换行css自动换行css自动换行css自动换行css自动换行css自动换行

    CSS网站布局与美化,css

    CSS网站布局与美化CSS网站布局与美化CSS网站布局与美化CSS网站布局与美化CSS网站布局与美化CSS网站布局与美化CSS网站布局与美化CSS网站布局与美化CSS网站布局与美化CSS网站布局与美化CSS网站布局与美化CSS网站布局与...

    精通CSS第二版、CSS那些事、CSS权威指南 第3版

    这份压缩包包含三本关于CSS的重要书籍:《精通CSS:(第2版)》、《CSS那些事儿》以及《CSS权威指南 第3版》,这些都是深入理解和掌握CSS技术的宝贵资源。 首先,我们来看《精通CSS:(第2版)》。这本书由Peter ...

    css framework 漂亮的CSS

    <link rel="stylesheet" href="../css/screen.css" type="text/css" media="screen, projection"> <link rel="stylesheet" href="../css/print.css" type="text/css" media="print"> <!--[if IE]> ...

    div+css布局大全

    2. **CSS(Cascading Style Sheets)**:CSS是一种样式表语言,用于描述HTML或XML(包括如SVG、MathML等各种XML方言)文档的呈现。CSS控制了元素的字体、颜色、大小、位置等视觉特性,使得网页设计更具表现力和灵活...

Global site tag (gtag.js) - Google Analytics