Question

我希望有一个常见的css文件类型的东西来应用jquerymobile特定属性，例如我的header，content，footer几个静态html页面都有data-theme="b"。如果我想将主题更改为“a”，我必须在每个部分编辑所有htmls。

我可以在一个公共场所定义这个data-theme吗？

谢谢， nehatha

Answer 1

这很简单。您可以创建和编辑jquery mobile css文件。您的所有课程名称都应以标准 ui - 开头。下面是我自己项目中名为“f”的新主题。

.ui-bar-f {
    border: 1px solid       #915a36;
    background:             #ab6043;
    color:                  #ffffff;
    font-weight: bold;
    text-shadow: 0 -1px 1px #000000;
    background-image: -moz-linear-gradient(top, 
                            #ab6043, 
                            #804000);
    background-image: -webkit-gradient(linear,left top,left bottom,
        color-stop(0,   #ab6043),
        color-stop(1,   #804000));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#ab6043', EndColorStr='#804000')";
}
.ui-bar-f, 
.ui-bar-f input, 
.ui-bar-f select, 
.ui-bar-f textarea, 
.ui-bar-f button {
    font-family: Helvetica, Arial, sans-serif;`
}
.ui-bar-f .ui-link-inherit {
    color:                  #fff;
}
.ui-bar-f .ui-link {
    color:                  #7cc4e7;
    font-weight: bold;
}
.ui-body-f {
    border: 1px solid       #915a36;
    background:             #d99e79;
    color:                  #000;
    text-shadow: 0 1px 0    #f1f1f1;
    font-weight: normal;
    background-image: -moz-linear-gradient(top, 
                            #faeee8, 
                            #faeee8);
    background-image: -webkit-gradient(linear,left top,left bottom,
        color-stop(0,       #faeee8),
        color-stop(1,       #faeee8));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#faeee8', EndColorStr='#faeee8)')";
}
.ui-body-f {
    font-family: Helvetica, Arial, sans-serif;
}
.ui-body-f input,
.ui-body-f search,
.ui-body-f select,
.ui-body-f textarea,
.ui-body-f button {
    font-family: Helvetica, Arial, sans-serif;
    color:#0000a0;
}
.ui-body-f .ui-link-inherit {
    color:                  #fff;
}
.ui-body-f .ui-link {
    color:                  #915a36;
    font-weight: bold;
}
.ui-br {
    border-bottom: rgb(130,130,130);
    border-bottom: rgba(130,130,130,.3);
    border-bottom-width: 1px;
    border-bottom-style: solid;
}
.ui-btn-up-f {
    border: 2px solid       #754e35;
    background:             #400040;
    font-weight: bold;
    color:                  #fff;
    text-shadow: 0 -1px 1px #000;
    background-image: -moz-linear-gradient(top, 
                            #dd6f00, 
                            #400040);
    background-image: -webkit-gradient(linear,left top,left bottom,
        color-stop(0,       #dd6f00),
        color-stop(1,       #400040));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#d20000', EndColorStr='#400000')";
}
.ui-btn-up-f a.ui-link-inherit {
    color:                  #f0f0f0;
}
.ui-btn-hover-f {
    border: 2px solid       #734a37;
    background:             #d99e79;
    font-weight: bold;
    color:                  #000000;
    text-shadow: 0 -1px 1px #f0f0f0;
    background-image: -moz-linear-gradient(top, 
                            #edd1c0, 
                            #d99e79);
    background-image: -webkit-gradient(linear,left top,left bottom,
        color-stop(0,       #edd1c0),
        color-stop(1,       #d99e79));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#edd1c0', EndColorStr='#d99e79')";
}
.ui-btn-hover-f a.ui-link-inherit {
    color:                  #000;
}
.ui-btn-down-f {
    border: 2px solid       #000;
    background:             #3d3d3d;
    font-weight: bold;
    color:                  #fff;
    text-shadow: 0 -1px 1px #000;
    background-image: -moz-linear-gradient(top, 
                            #edd1c0, 
                            #d99e79);
    background-image: -webkit-gradient(linear,left top,left bottom,
        color-stop(0,       #edd1c0),
        color-stop(1,       #d99e79));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#edd1c0', EndColorStr='#d99e79')";
}
.ui-btn-down-f a.ui-link-inherit {
    color:                  #fff;
}
.ui-btn-up-f,
.ui-btn-hover-f,
.ui-btn-down-f {
    font-family: Helvetica, Arial, sans-serif;
    text-decoration: none;
    font-size:19px;
}

jquerymobile：我可以在常见的css文件中定义jquerymobile特定属性

1 个答案: