添加滚动条并选择图像而不是单选按钮

Question

嗨现在我创建了选项字段到我的Wordpress选项页面我的字段它包含36个图像用于我的身体主题模式所有东西都完美地工作

如何才能将滚动条添加到我的选项字段，直到只显示一些图像，然后通过滚动显示另一个图像？

如何隐藏单选按钮并在单选按钮上选择图像？

这是我的代码

function YPE_body_pattern_callback() {
    ?>
        <div>
            <h3>Choose Pattern</h3>
            <?php
                $checked = 'checked="checked"';
                $YPE_options = get_option( 'YPE_post_option_name' );
            ?>
            <ul class="list-inline">
                <?php for($i=1 ; $i<=36 ; $i++ ){ 
                 $pattern = 'body-bg'.$i; ?>
                <li>
                    <input name="YPE_post_option_name[YPE_body_pattern]" type="radio" value="<?php echo $pattern ?>" <?php if($YPE_options['YPE_body_pattern'] == $pattern ) echo $checked; ?> />
                    <a href="#">
                        <img src="<?php echo get_template_directory_uri(); ?>/panel/images/patterns/<?php echo $pattern ?>.png" />
                    </a>
                </li>
                <?php } ?>
            </ul>
        </div>
    <?php
}

Answer 1

我通过使用overflow:scroll;width:300px; css属性将滚动条添加300px高度解决了我的问题