Question

如何你更改CSS以将其移动到页面的另一部分？

以下是我正在使用的图片：http://www.frysa.us/switch.gif

功能：

<script type="text/javascript" src="jquery.js" charset="utf-8"></script>
<script type="text/javascript">

$(document).ready( function(){ 
$(".cb-enable").click(function(){
    var parent = $(this).parents('.switch');
    $('.cb-disable',parent).removeClass('selected');
    $(this).addClass('selected');
    $('.checkbox',parent).attr('checked', true);
});
$(".cb-disable").click(function(){
    var parent = $(this).parents('.switch');
    $('.cb-enable',parent).removeClass('selected');
    $(this).addClass('selected');
    $('.checkbox',parent).attr('checked', false);
});
});

.gif的重复性质似乎让我的定位陷入困境。

我希望它能更多地出现在右边

<style type="text/css">
* { margin: 0; padding: 0: }

body { font-family: Arial, Sans-serif; }
.cb-enable, .cb-disable, .cb-enable span, .cb-disable span { background: url
(switch.gif) repeat-x; display: block;float: left;}  
.cb-enable span, .cb-disable span { line-height: 30px; display: block; background-
repeat: no-repeat; font-weight: bold; }
.cb-enable span { background-position: left -90px; padding: 0 10px; }
.cb-disable span { background-position: right -180px;padding: 0 10px; }
.cb-disable.selected { background-position: 0 -30px; }
.cb-disable.selected span { background-position: right -210px; color: #fff; }
.cb-enable.selected { background-position: 0 -60px; }
.cb-enable.selected span { background-position: left -150px; color: #fff; }
 .switch label { cursor: pointer; }

 </style>

Answer 1

如果您只想将其向右移动120像素，请为您的元素（现在是段落标记）提供ID并执行此操作：

#switchingButton{
    margin-left: 120px;
}

你可以使用padding-left：120px;如果你的设计需要填充而不是边距。

使用CSS移动元素

1 个答案: