目标 需要实现如下的效果 要求 要求内容能够自适应,比如添加步骤5、步骤6, 内容能够自动等宽,而不是手动修改width; 步骤之间的横线也要自适应,能够随着页面宽度的拉伸而伸长; 步骤数字能够自动计算,而不是手动修改添加; 良好的语义化 ...
目标 需要实现如下的效果 要求 要求内容能够自适应,比如添加步骤5、步骤6, 内容能够自动等宽,而不是手动修改width; 步骤之间的横线也要自适应,能够随着页面宽度的拉伸而伸长; 步骤数字能够自动计算,而不是手动修改添加; 良好的语义化 ...
vue 封装 step 步骤条组件 ...
<div class="contract-operate_recodeMain"> <ul class="contract ...
话不多说直接上组件代码。。 调用组件。。。 效果如下: 参考原文:https://blog.csdn.net/xqq580231/article/details/78086173 ...
在这里记录一个手写的步骤条,先看效果 重点就是,进度条与步骤div的宽保持一致,比如完成了第一步,就是进度条的width就是22%,完成了第二步,就是44%,当然这个是可以自由调整的 HTML代码 CSS样式 参考链接:jquery步骤条step插件 ...
步骤条很常见,但是网上很多都不太智能,不适合放在手机上的步骤条,应一位朋友的求帮忙,故写了一个可以加任意多个步骤,宽度仍然等比,超过屏幕还可以滑动的步骤条ui。具体展示如下: 于若需要请移步我的github,按照自己的需求自行修改。其中横向滑动可以参加另外一篇文章 :css如何实现滚动条隐藏 ...
用css写一个简单的步骤进度条 html代码: View Code css代码: View Code ...
<!-- 未激活颜色: uncolor:'#ccc' 激活 active:0 数据源 data:[{},{}] 步骤条类型:type basic detail num more --> <steps uncolor="#ccc" type="detail ...