`

背景渐变的DIV

 
阅读更多
<style>
.gradual {
    width: auto;
    height: 21px;
    line-height: 21px;
    filter: alpha(opacity=100,finishopacity=100,style=1,startx =0,starty=0,finishx=0,finishy=21) progid:DXImageTransform.Microsoft.gradient(startcolorstr=#6d9fde, endcolorstr=#4583d2,gradientType=0);
    -ms-filter: alpha(opacity=100,finishopacity=100,style=1,startx =0,starty=0,finishx=0,finishy=21) progid:DXImageTransform.Microsoft.gradient(startcolorstr=#6d9fde, endcolorstr=#4583d2,gradientType=0);
    background: #4583d2;
    background: -moz-linear-gradient(top, #6d9fde, #4583d2);
    background: -webkit-gradient(linear, 0 0, 0 bottom, from(#6d9fde),to(#4583d2));

    color:#FFFFFF;
    font-size:12px;
    font-family:"宋体",Arial;
    padding:0 5px;
    text-align:right;
}
</style>

<div style="width:62px;">
<div class="gradual">
    <a>添加属性</a>
</div>
</div>

 

分享到:
评论

相关推荐

    CSS 背景渐变

    CSS 设计指南学习小结

    DIV进阶效果集(圆角div、div自适应宽度、背景色渐变等)

    本篇文章将深入探讨`div`的一些进阶效果,包括圆角`div`、自适应宽度、背景色渐变、多行自适应高度以及固定高度与内容自动变高等CSS技术。 首先,让我们关注圆角`div`。CSS3引入了`border-radius`属性,使得我们...

    div背景颜色怎样渐变 css实现div层背景颜色渐变代码

    在这个例子中,它选中了`&lt;div&gt;`元素,并为其应用了背景渐变效果。 3. **CSS属性**: - `width:100%; height:600px;` 这两个属性设置了div的宽度为100%,高度为600像素,确保整个视窗都能看到渐变效果。 4. **...

    DIV框渐变填充实现源代码

    渐变还可以结合其他CSS属性,如背景重复、位置和尺寸,以达到更复杂的效果。例如,使用`background-size`可以调整渐变图案的大小,使其覆盖整个`div`元素。 ```css div { background-size: cover; } ``` 在实际...

    QQ登录框背景渐变动画特效.zip

    QQ登录框背景渐变动画特效是前端开发中一种常见的视觉设计手法,主要通过CSS3、JavaScript和可能结合jQuery来实现。这个压缩包文件包含了实现这一效果的资源,让我们一一解析这些知识点。 首先,我们来看看CSS在...

    CSS3简约大气背景渐变特效.rar

    《CSS3背景渐变特效详解》 在网页设计领域,CSS3的引入为开发者提供了更为丰富和精细的样式控制手段,其中背景渐变特效就是一项非常实用且具有视觉吸引力的功能。"CSS3简约大气背景渐变特效.rar"这个压缩包文件,...

    Jquery弹出div层窗口以及div屏幕居中,背景滤镜效果,div拖拽效果

    例如,可以为背景添加渐变阴影: ```css body { background-color: #f0f0f0; transition: background-color 0.5s ease; } body.shaded { background-color: rgba(0, 0, 0, 0.5); } ``` 然后,使用jQuery切换类...

    css教程实现div背景色渐变色代码分享

    本文将通过一个简单的示例来详细介绍如何使用 CSS 来实现 div 的背景渐变效果。该方法适用于多种浏览器,并兼容主流的 Web 标准。 #### 二、基础知识回顾 在正式介绍示例之前,我们先来回顾一下与本主题相关的几个...

    好用的div渐变,美化你的网页

    ### DIV渐变技术详解 #### 一、引言 在网页设计中,使用渐变效果可以为页面增添视觉上的美感,提升用户体验。本篇文章将详细介绍一种实用的div渐变技术,帮助开发者轻松实现美观的渐变效果,无需再烦恼于复杂的CSS...

    基于KISSY的背景渐变特效.zip

    在本项目中,"基于KISSY的背景渐变特效.zip"是一个前端开发案例,它主要利用了JavaScript库KISSY来实现动态的背景颜色渐变效果。KISSY是阿里巴巴开源的一款轻量级的JavaScript框架,旨在提供一套完整的前端解决方案...

    纯CSS3制作科技感十足的背景发光渐变网页Loading加载动画特效源码.zip

    例如,我们可以为Loading元素创建一个从深色到浅色的背景渐变: ```css .loading-icon { background: linear-gradient(to right, #002244, #4488cc); } ``` 此外,为了让动画更具有科技感,我们还可以添加光效。...

    div+css背景渐变色代码示例

    在网页设计中,创建引人注目的视觉效果是至关重要的,而背景渐变色就是一种常用的技巧,可以为页面元素增添层次感和动态感。在CSS(层叠样式表)中,我们可以用多种方法实现背景渐变效果。本文将详细解释如何通过`...

    css3实现一个div设置多张背景图片及background-image属性实例演示

    本文将深入探讨如何使用`background-image`属性来实现多张背景图片的设置,并介绍CSS3中的背景渐变。 首先,我们来看一下`background-image`属性的基本语法。它接受一个或多个 `&lt;bg-image&gt;` 值,每个值可以是 `none...

    利用div+css3实现一个背景渐变的button按钮的示例代码

    本文利用div和css3新属性,实现了一个背景渐变的按钮,具体如下: 1.background: linear-gradient 背景为渐变色属性 2.利用css3中动画特性animation,实现背景从左至右变化(color_move) 3.为了实现渐变效果,将...

    asp.net 渐变的窗口背景

    渐变的窗口背景是一种常见的设计手法,能够使网页或应用程序看起来更加现代和专业。在这个话题中,我们将深入探讨如何在ASP.NET中实现渐变背景,并使用C#语言进行编程。 首先,渐变背景是指颜色从一种色调平滑过渡...

    CSS设置DIV背景色渐变显示兼容IE/火狐/谷歌

    标题中的“CSS设置DIV背景色渐变显示兼容IE/火狐/谷歌”指的是在网页设计中,使用CSS来实现一个DIV元素的背景颜色渐变效果,并确保这种效果在不同的浏览器,包括Internet Explorer(IE)、Firefox和Google Chrome...

    漂亮div层 精美div层

    - **背景**:可以设置背景颜色、图片,甚至使用渐变或图案,使Div层看起来更吸引人。 - **边框**:添加边框以突出内容,可以调整边框宽度、颜色和样式。 - **内边距和外边距**:通过padding和margin调整内容与...

    用CSS3实现背景渐变的方法

    CSS3 之前,必须依赖 Adobe Photoshop 等图形处理软件来制作渐变图,再以背景图片方式添加给元素。 而现在, 使用 CSS就可以创造出各种渐变效果了。渐变是 CSS 帮我们生成的背景图片。添加渐变可以使用 background-...

Global site tag (gtag.js) - Google Analytics