Question

我试图单独更改为标题栏颜色。所以我使用.ui-dialog-titlebar，但它不起作用，所以我尝试使用ui-widght-header，它反映到数据表也..请指教。

//无效

.ui-dialog-titlebar {
  background-color: #F9A7AE;
  background-image: none;
  color: #000;
}

//工作，但也反映到数据表标题..

.ui-widget-header
{
    background-color: #99CCFF;
    background-image: none;
    color: Black;
}

我只看颜色对话框标题栏。请注意。

Answer 1

jQuery UI组件共享很多类，但是一个对话框总是有ui-dialog类，所以如果只定位对话框的直接标题子元素，它应该可以工作：

.ui-dialog > .ui-widget-header {background: red;}

FIDDLE

Answer 2

仅供参考：如果你想切换模态标题的颜色，你可能想做这样的事情：

if(Success)
  $(".ui-dialog").find(".ui-widget-header").css("background", "darkgreen");
else
  $(".ui-dialog").find(".ui-widget-header").css("background", "red");

Answer 3

如果您希望每个ID都是特定的

$("#dialogId1).closest(".ui-dialog").children(".ui-dialog-titlebar").css("background", "lightblue");

$("#dialogId2).closest(".ui-dialog").children(".ui-dialog-titlebar").css("background", "yellow");

Answer 4

另一种简单的方法：只需使用下面的类更改您的CSS文件上的标题栏颜色

<TableRow
            android:id="@+id/Row1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">


            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent">

                <ImageView
                    android:id="@+id/imageView6"
                    android:layout_width="65dp"
                    android:layout_height="65dp"
                    android:layout_margin="12dp"
                    android:src="@drawable/image9" />

                <Button
                    android:id="@+id/button1"
                    android:layout_width="65dp"
                    android:layout_height="65dp"
                    android:layout_margin="12dp"
                    android:background="@drawable/ic_button2"
                    android:text=""
                    android:textSize="35sp"
                    app:theme="@style/coolveticaButton" />

            </FrameLayout>


            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent">

                <ImageView
                    android:id="@+id/imageView5"
                    android:layout_width="65dp"
                    android:layout_height="65dp"
                    android:layout_margin="12dp"
                    android:src="@drawable/image9" />

                <Button
                    android:id="@+id/button2"
                    android:layout_width="65dp"
                    android:layout_height="65dp"
                    android:layout_margin="12dp"
                    android:background="@drawable/ic_button2"
                    android:text=""
                    android:textSize="35sp"
                    app:theme="@style/coolveticaButton" />
            </FrameLayout>

            <Button
                android:id="@+id/button3"
                android:layout_width="65dp"
                android:layout_height="65dp"
                android:layout_margin="12dp"
                android:background="@drawable/ic_button2"
                android:text=""
                android:textSize="35sp"
                app:theme="@style/coolveticaButton" />

            <Button
                android:id="@+id/button4"
                android:layout_width="65dp"
                android:layout_height="65dp"
                android:layout_margin="12dp"
                android:background="@drawable/ic_button2"
                android:text=""
                android:textSize="35sp"
                app:theme="@style/coolveticaButton" />

        </TableRow>

Jquery对话框 - 标题栏颜色更改

4 个答案: