Question

例如。我正在使用此代码：

$(".sample").click(function() {
  var html = [],
    x = $(this).css([
      "margin", "padding", "color", "border"
    ]);

  $.each(x, function(prop, value) {
    html.push(prop + ": " + value);
  });

  $("#result").html(html.join("<br>"));


})

关于代码：

此代码用于根据给定的数组x：

来增强css属性

我想要的是什么：

我希望当属性类似于边距，填充，背景（具有多个选项的属性）时，它会分开来清楚这里是示例

对于保证金和填充

如果保证金/填充为0

margin / padding：0;

然后

它会像这样打印出来

margin / padding = 0 0 0 0;

否则，如果保证金/填充类似于0 10 6 7

它会像这样打印出来

保证金/填充：0 10 6 7

背景

如果背景是url（../ sample.jpg）20px 20px no-repeat cover red

它会像这样打印出来

background-image = url（../ sample.jpg）

backgound-top = 20px

背景中心= 20px

background-repeat = no-repeat

background-cover =封面

background-color = red

否则，如果背景颜色为红色或背景重复为封面//（为此只需要一些提示）

它会像这样打印出来

background-color = red

background-repeat = no-repeat

Answer 1

创建一个类

.test{
    margin:0;
    padding:0;
}
.newTest{
    margin:0;
    padding:0;
}

并像所有条件一样检查循环：

if($('#yourElement').hasClass('test')){
     document.getElementById("yourElement").innerHTML = "margin/padding = 0 0 0 0;";
});

如何打破边距，填充和背景属性？

1 个答案: