กรณีไฟล์ทดสอบ สมมติให้ชื่อว่า php_css.php
ในที่นี้จะแนะนำ การใช้งาน php กับ css ที่นำมาใช้งานในรูปแบบต่างๆ ได้แก่
แบบ in-line
แบบ Internal
แบบ External
ศึกษาการใช้งาน css ใน 3 รูปแบบได้ที่
https://www.ninenik.com/การใช้งาน_CSS__ศึกษาิวิธีการนำ_CSS_ไปใช้กับ_HTML-59.html
1. การใช้งาน php กับ css แบบ inline โดยการแทรกค่าตัวแปร php เข้าไปใน css style แบบ inline
โค้ดไฟล์ php_css.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>php css random</title>
</head>
<body>
<?php
// กำหนดค่า array สี สำหรับทดสอบ
$arr_mycolor=array("#5AB820","#E7CD3A","#3A7BE7","#E73AE1","#E73A6B");
// แบบที่ 1
// อธิบาย array_rand($arr_mycolor) ทำการ random เอาค่า key ของ array ค่าสี
$my_randcolor=$arr_mycolor[array_rand($arr_mycolor)]; // ดึง array ค่าสีจาก key ที่ random ได้
// แบบที่ 2
// shuffle($arr_mycolor); // ทำการสลับตำแหน่งของ array
// $my_randcolor=$arr_mycolor[0]; // ดึงค่า array สีตัวแรกหลังสลับตำแหน่งแล้ว
?>
<p style="color:<?=$my_randcolor?>;">www.ninenik.com</p>
</body>
</html>
2. การใช้งาน php กับ css แบบ Internal โดยการแทรกค่าตัวแปร php เข้าไปในส่วน head ด้วยแท็ก style
โค้ดไฟล์ php_css.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<?php
// กำหนดค่า array สี สำหรับทดสอบ
$arr_mycolor=array("#5AB820","#E7CD3A","#3A7BE7","#E73AE1","#E73A6B");
// แบบที่ 1
// อธิบาย array_rand($arr_mycolor) ทำการ random เอาค่า key ของ array ค่าสี
$my_randcolor=$arr_mycolor[array_rand($arr_mycolor)]; // ดึง array ค่าสีจาก key ที่ random ได้
// แบบที่ 2
// shuffle($arr_mycolor); // ทำการสลับตำแหน่งของ array
// $my_randcolor=$arr_mycolor[0]; // ดึงค่า array สีตัวแรกหลังสลับตำแหน่งแล้ว
?>
<style type="text/css">
p{
background-color:<?=$color?>;
}
</style>
</head>
<body>
<p>www.ninenik.com</p>
</body>
</html>
3. การใช้งาน php กับ css แบบ External โดยการสร้างไฟล์ css จาก php ไฟล์ สมมติชื่อ gencss.php
แล้วนำมาใช้ในไฟล์ php_css.php ด้วย แท็ก link
โค้ตไฟล์ gencss.php
<?php
header("Content-type:text/css; charset=UTF-8");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
// กำหนดค่า array สี สำหรับทดสอบ
$arr_mycolor=array("#5AB820","#E7CD3A","#3A7BE7","#E73AE1","#E73A6B");
// แบบที่ 1
// อธิบาย array_rand($arr_mycolor) ทำการ random เอาค่า key ของ array ค่าสี
$my_randcolor=$arr_mycolor[array_rand($arr_mycolor)]; // ดึง array ค่าสีจาก key ที่ random ได้
// แบบที่ 2
// shuffle($arr_mycolor); // ทำการสลับตำแหน่งของ array
// $my_randcolor=$arr_mycolor[0]; // ดึงค่า array สีตัวแรกหลังสลับตำแหน่งแล้ว
?>
p{
color:<?=$my_randcolor?>;
}
โค้ดไฟล์ php_css.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <!--นำ css ไฟล์จากการ gen ด้วย php มาใช้งานแบบ external--> <link rel="stylesheet" type="text/css" href="gencss.php" /> </head> <body> <p>www.ninenik.com</p> </body> </html>
