Bagaimanakah Saya Boleh Menyesuaikan Gaya Butang Kotak Makluman?-tutorial js-php.cn

Bagaimanakah Saya Boleh Menyesuaikan Gaya Butang Kotak Makluman?

Linda Hamilton

Lepaskan： 2024-12-04 11:11:11

asal

949 orang telah melayarinya

How Can I Customize the Style of Alert Box Buttons?

Menyesuaikan Gaya Butang Kotak Makluman

Kotak amaran lalai mungkin tidak sentiasa sesuai dengan estetika aplikasi anda. Nasib baik, terdapat cara untuk mengubah suai rupa butang "OK" khususnya.

Had Makluman Asli

Malangnya, kotak amaran asli ialah sistem- objek yang ditentukan yang tidak boleh digayakan menggunakan CSS. Had ini berpunca daripada statusnya sebagai objek sistem.

Mencipta Elemen Tersuai

Untuk mengatasi halangan ini, pertimbangkan untuk mencipta elemen HTML tersuai yang mereplikasi kefungsian kotak amaran . Dengan berbuat demikian, anda memperoleh keupayaan untuk menggunakan CSS dan menyesuaikan penampilan seperti yang diperlukan.

Dialog UI jQuery

Pemalam Dialog UI jQuery cemerlang dalam tugas ini. Ia menyediakan rangka kerja untuk mencipta kotak dialog tersuai dengan pilihan penggayaan yang boleh disesuaikan.

Contoh

Coretan kod berikut menunjukkan cara mencipta kotak dialog tersuai menggunakan UI jQuery:

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Custom Alert Box</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
    $(function() {
      $("#dialog").dialog({
        buttons: {
          "OK": function() {
            $(this).dialog("close");
          }
        }
      });
    });
  </script>
</head>

<body>

  <div>

Salin selepas log masuk

Dengan menggunakan elemen HTML tersuai dan perpustakaan pihak ketiga seperti jQuery UI, anda boleh memperibadikan gaya butang kotak amaran dengan mudah untuk memenuhi keperluan aplikasi anda.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menyesuaikan Gaya Butang Kotak Makluman?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!