`
jsntghf
  • 浏览: 2533909 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

渐变打分条

web渐变打分条csshtml 
阅读更多 

<!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>
    <title>渐变效果</title>
    <style type="text/css">
      .ffbg
      {
        background-image: url(1.gif);
        background-repeat: no-repeat;
        background-position: 0px 0px;
        height: 55px;
        width: 296px;
      }
      .fft
      {
        background-image: url(2.gif);
        background-repeat: no-repeat;
        background-position: 0px 0px;
        height: 22px;
        width: 28px;
        color: #FFFFFF;
        text-align: center;
        font-size: 12px;
        float:right;
      }
    </style>
  </head>
  <body>
    <div style="left:200px; top: 20px; width: 300px; height: 59px; padding-top: 2px;"> 
      <div class="ffbg">
        <div id="divIn" style="width: 90%">
          <span class="fft">90</span>      
        </div>
      </div> 
    </div>
  </body>
</html>

 

效果图：


分享到：
| 用UIWebView在当前程序中打开网页（二）
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    自定义星级评分条

    在IT界，自定义星级评分条是一种常见的用户界面（UI）元素，用于让用户对产品、服务或内容进行评价。这种控件通常由一系列星形图标组成，用户可以选择一颗或多颗星来表示他们的满意度等级。本篇文章将深入探讨如何在...

    半圆渐变评分进度条（自带带截图功能）

    半圆渐变评分进度条（自带带截图功能） 博客中的实例代码。 一个可以动画显示评分的半圆进度条。 进度条颜色为渐变色。并自带截图功能。

    js星级评分点击星级评论打分效果

    进度条通常用来表示平均评分或总体评分，可以使用`&lt;progress&gt;`元素或自定义的背景渐变来创建。点评条则可能是一个列表，展示用户的评论，可以通过遍历评论数据并动态生成HTML来实现。 总的来说，这个项目涵盖了...

    纯css3星星打分特效.zip

    总的来说，纯CSS3星星打分特效充分利用了CSS3的高级特性，包括伪类选择器、渐变、过渡、布局工具以及形状剪切等，实现了一种无需JavaScript交互的评分系统。这种技术对于提升网页的用户体验和互动性具有重要意义，...

    仿AppStore星级条，等级条,iOS代码，OC绘图

    然后，为了实现动态打分功能，我们需要在`drawRect:`中根据评分值调整星星的填充状态。一种常见的方式是创建一个分数比例，根据此比例决定哪些星星应被完全填充，哪些部分填充，以及哪些保持空心。可以通过修改`...

    类似appstore打分条功能

    标题中的“类似appstore打分条功能”指的是在iOS应用开发中实现的一种用户评价系统，模仿了Apple App Store中的评分条设计。App Store中的评分条允许用户对应用程序进行直观的一到五星评分，这一功能对于开发者来说...

    jq评分加进度条

    4. **动画效果**：jQuery的`.animate()`方法可以添加平滑的过渡效果，如评分改变时进度条的渐变填充。 5. **Ajax交互**：如果评分需要提交到服务器，可以使用`.ajax()`或`.post()`方法发送请求，同时处理响应以更新...

    CSS3评分百分比统计图

    2. **渐变（`linear-gradient`）**：线性渐变可用于创建百分比条的填充效果，通过调整角度和颜色停靠点，可以实现横向或纵向的填充条。 3. **旋转（`transform: rotate()`）**：如果需要将统计图旋转一定的角度，...

    安卓自定义控件相关-android自定义评分控件ratingbar.rar

    为了增强用户体验，自定义评分条可能包含动画效果，如评分改变时星星的渐变填充。这可能通过`ValueAnimator`、`ObjectAnimator`或者`AnimatorSet`实现。 7. **布局集成** 自定义控件可以像任何其他Android原生...

    ios-打分动态效果图.zip

    "ios-打分动态效果图.zip"文件显然包含了实现这种效果的资源，特别是模仿360安全卫士中分数展示的动态渐变过程。这种效果能够吸引用户的注意力，同时提供一种直观的方式来传达信息，例如系统性能、健康状况或者用户...

    ios-仿芝麻评分.zip

    4. **颜色（Color）和渐变（Gradient）**：通过`CGColor`和`CGGradient`，我们可以设置填充颜色、描边颜色，甚至实现渐变效果，使得评分条目更加生动。 5. **阴影（Shadow）**：`CGContextSetShadow()`可以添加阴影...

    评分星星图片

    2. 设计风格：设计风格应该与应用或网站的整体风格一致，可以是扁平化设计、拟物化设计或是具有渐变和阴影效果的设计。颜色通常是金色或银色，但也可以根据品牌调色板定制。 3. 交互性：在动态评分系统中，图片可能...

    jQuery表情图标评价打分代码.zip

    3. **jQuery特效**：在描述中提到的“非常实用的jquery代码”可能包含了一些动画效果，比如当用户点击表情图标时，评分的变化可能会有平滑过渡或者渐变等视觉效果，这些都是jQuery强大的动画功能的体现。 4. **...

    android 自定义评分

    例如，当用户改变评分时，星星可以从未选中渐变到选中状态。这可以通过`ObjectAnimator`或`ValueAnimator`实现。 9. **适配器与RecyclerView**： 如果评分组件在列表或网格中使用，可能需要将其集成到`Adapter`中...

    纯css3简单的星星打分特效

    "纯css3简单的星星打分特效"是指利用CSS3特性实现的一种交互式的评分展示方式，常用于评论系统或者产品评价中，让用户通过点击星星来给予评分。这个特效不仅美观，而且能够提升用户体验，因为它提供了直观且易于操作...

    iOS打星评分demo.zip

    为了提升用户体验，可以添加动画效果，比如星星在被选中时有渐变色的变化，或者在提交评分后给出反馈提示。 总的来说，"iOS打星评分demo.zip"包含了一个完整的五星评价系统的实现，涵盖了UI设计、手势识别、交互...

    几何渐变人事述职报告PPT模板.pptx

    报告应列出考核标准、评分机制，以及员工的绩效得分和排名，以便管理层了解团队和个人的工作成效。 5. **年度绩效考核**：年度考核是对员工全年工作的总结评价，通常包括个人目标达成、团队协作、能力提升等多个...

    基于CSS3实现六种不同动画效果星级评分特效源码.zip

    1. 渐变填充：CSS3的`linear-gradient`和`radial-gradient`允许我们创建线性和径向渐变背景，为星级评分添加平滑的色彩过渡。这可以用来模拟星星从未选中到选中的状态变化，给用户带来视觉上的连续感。 2. 动态填充...

    js+CSS 星级评分 多级 通用 实例

    CSS还可以用于创建动画效果，如鼠标悬停时星星的渐变或选中状态的变化，以增强用户体验。 【多级评分】是指用户可以对某一项目进行细粒度的评价，比如1到5星，甚至可以有半星的选择。实现这一功能，开发者需要考虑...

Magicbox
Global site tag (gtag.js) - Google Analytics