jQuery CSS অপারেশন - css() মথড

jQuery CSS โอปเปอร์เกชัน อธิบายคู่มือ

ตัวอย่าง

<p> ইলেকট্রনের রঙ সেট করুন:

$(".btn1").click(function(){
  $("p").css("color","red");
});

ตั้งตนเองทดสอบ

সংজ্ঞা ও ব্যবহার

css() মথড ম্যাচকৃত ইলেকট্রনকের একটি বা একাধিক স্টাইল এসট্রাইপ রিটার্ন করে বা সেট করে

CSS এসট্রাইপের মান ফিরিয়ে দেওয়া

প্রথম ম্যাচকৃত ইলেকট্রনিকের CSS এসট্রাইপের মান ফিরিয়ে দেয়।

মন্তব্য:একটি মান ফিরিয়ে দেওয়ার জন্য, সংক্ষিপ্ত CSS এসট্রাইপ (যেমন "background" এবং "border") সমর্থিত না।

$(selector).css(name)
พารามิเตอร์ คำอธิบาย
name প্রয়োজনীয়।CSS এসট্রাইপের নাম নির্দিষ্ট করুন।এই পারামিটারটি কোনও CSS এসট্রাইপ নিয়ে থাকতে পারে।যেমন "color"。

ตัวอย่าง

প্রথম সেকশনের color স্টাইল এসট্রাইপের মান পান:

$("p").css("color");

ตั้งตนเองทดสอบ

CSS এসট্রাইপ সেট করুন

ตั้งค่า CSS คุณสมบัติที่กำหนดของสิ่งที่ตรงกันข้ามทั้งหมด

$(selector).css(name,value)
พารามิเตอร์ คำอธิบาย
name จำเป็น กำหนดชื่อ CSS คุณสมบัติ พารามิเตอร์นี้สามารถรวมได้คุณสมบัติ CSS ทุกชนิด เช่น "color"
value

ตัวเลือก กำหนดค่า CSS คุณสมบัติ พารามิเตอร์นี้สามารถรวมได้ค่า CSS ทุกชนิด เช่น "red"

ถ้ากำหนดค่าว่าง ก็จะลบคุณสมบัติที่กำหนดออกจากสิ่งที่ตรงกันข้าม

ตัวอย่าง

ตั้งค่าสีของทุกย่อหน้าเป็นแดง:

$("p").css("color","red");

ตั้งตนเองทดสอบ

ตั้งค่า CSS คุณสมบัติด้วยฟังก์ชัน

ตั้งค่าค่าสไตล์คุณสมบัติของสิ่งที่ตรงกันข้ามทั้งหมดที่ตรงกันข้าม

ฟังก์ชันนี้กลับค่าค่าที่ต้องการตั้งค่า รับสองพารามิเตอร์ index คือตำแหน่งสิ่งที่ตรงกันข้ามในชุดวัตถุ และ value คือค่าปัจจุบันของคุณสมบัติ

$(selector).css(name,function(index,value))
พารามิเตอร์ คำอธิบาย
name จำเป็น กำหนดชื่อ CSS คุณสมบัติ พารามิเตอร์นี้สามารถรวมได้คุณสมบัติ CSS ทุกชนิด เช่น "color"
function(index,value)

กำหนดฟังก์ชันที่กำหนดค่าใหม่ของ CSS คุณสมบัติ

  • index - ตัวเลือก รับตำแหน่ง index ของเลือก
  • oldvalue - ตัวเลือก รับค่าปัจจุบันของ CSS คุณสมบัติ

ตัวอย่าง 1

ตั้งค่าสีของทุกย่อหน้าเป็นแดง:

$("button").click(function(){
    $("p").css("color",function(){return "red";});
    });

ตั้งตนเองทดสอบ

ตัวอย่าง 2

เพิ่มความกว้างของ div ขึ้นเรื่อยๆ:

$("div").click(function() {
  $("this").css(
    "width", function(index, value) {return parseFloat(value) * 1.2;}
  );
});

ตั้งตนเองทดสอบ

ตั้งค่า CSS หลายคู่ค่า/ค่า

$(selector).css({property:value, property:value, ...})

ตั้งค่า "ชื่อ/ค่า" วัตถุให้เป็นคุณสมบัติสไตล์ของสิ่งที่ตรงกันข้ามทั้งหมดที่ตรงกันข้าม

นี่เป็นวิธีที่ดีที่สุดในการตั้งค่าคุณสมบัติสไตล์มากมายบนสิ่งที่ตรงกันข้ามทั้งหมด

พารามิเตอร์ คำอธิบาย
{property:value}

จำเป็น กำหนดว่าต้องการตั้งค่าสไตล์คุณสมบัติด้วย "ชื่อ/ค่า" ที่เป็นวัตถุ

พารามิเตอร์นี้สามารถรวมได้หลายคู่ของชื่อคุณสมบัติ/ค่า ตัวอย่าง {"color":"red","font-weight":"bold"}

ตัวอย่าง

$("p").css({
  "color":"white",
  "background-color":"#98bf21",
  "font-family":"Arial",
  "font-size":"20px",
  "padding":"5px"
  });

ตั้งตนเองทดสอบ

jQuery CSS โอปเปอร์เกชัน อธิบายคู่มือ