web建站教程

  1. 首页
  2. vuejs
  3. js
  4. 好玩
  5. seo教程
  6. 前端知识
  7. 百度echarts
  8. php入门
    nodejs
    mockjs
    mysql
    织梦cms
    帝国cms
    git教程

当前位置: 建站教程 > 前端知识 >

css3解决滚动条太难看问题

72 ℃

下面web建站教程为大家介绍一下css3解决滚动条太难看问题

问题描述:页面因内容太多出现一些滚动条,但是系统自动的滚动条太难看,下面web建站小编给大家介绍一下::-webkit-scrollbar的作用。

/*滚动条*/
::-webkit-scrollbar-track-piece {
  background-color: #fff;
}

::-webkit-scrollbar {
  width: 13px;
  height: 13px;
}

::-webkit-scrollbar-thumb {
  background-color: #aaa;
  background-clip: padding-box;
  min-height: 28px;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #aaa;
}

//如果不想显示滚动条
.sidebar::-webkit-scrollbar {
  width: 0;
}

远离javascript/jquery纯css3实现多级导航栏联动

纯css3绘制数字,文字太长自动显示...

CSS3滤镜如何实现波浪效果(附代码)

css3文字快闪切换动画效果代码

上面是“css3解决滚动条太难看问题”的全面内容,想了解更多关于 前端知识 内容,请继续关注web建站教程。

当前网址:https://ipkd.cn/webs_2292.html

声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!

wordpress栏目添加缩略图封面代码介绍

wordpress建站,如何在栏目添加缩略图封面功能,今天给大家分享一个如何通过代码来添加分类栏目缩略图字段功能,将如下代码添加到wordpress主functions.php中:

function salong_add_category_field(){
    echo '<div class="form-field">
            <label for="thumb">'.__('缩略图','salong').'</label>
            <input name="thumb" id="thumb" type="text" value="" size="40">
            <p>'.__('输入分类的缩略图链接。','salong').'</p>
          </div>';
}
add_action('category_add_form_fields','salong_add_category_field',10,2);
// 分类编辑字段  
function salong_edit_category_field($tag){
    echo '<tr class="form-field">
            <th scope="row"><label for="thumb">'.__('灰色地图','salong').'</label></th>
            <td>
                <input name="thumb" id="thumb" type="text" value="';  
                echo get_option('thumb-'.$tag->term_id).'" size="40"/><br>
                <span class="thumb">'.$tag->name.__('分类的缩略图链接。','salong').'</span>
            </td>
        </tr>';
}
add_action('category_edit_form_fields','salong_edit_category_field',10,2);
// 保存数据  
function salong_category_thumb($term_id){
    if(isset($_POST['thumb'])){
        //判断权限--可改  
        if(!current_user_can('manage_categories')){
            return $term_id;
        }
        $thumb_key = 'thumb-'.$term_id;
        $thumb_value = $_POST['thumb'];
        // 更新选项值  
        update_option( $thumb_key, $thumb_value );
    }
}
// 虽然要两个钩子,但是我们可以两个钩子使用同一个函数  
add_action('created_category','salong_category_thumb',10,1);
add_action('edited_category','salong_category_thumb',10,1);

添加好以上代码,如何调用呢,在需要显示分类缩略图的位置添加以下代码即可完成自动的调用功能:

echo get_option('thumb_color-'.$category_id)

点击阅读全文
上一篇:远离javascript/jquery纯css3实现多级导航栏联动
下一篇:利用@media实现不同分辨率的兼容