|
 |
|
ปรับขนาดอักษรในเว็บ PHP ต้องทำยังไงค่ะ ปรับขนาดอักษรในเว็บ PHP ต้องทำยังไงค่ะ |
|
 |
|
|
 |
 |
|
ทำไมไม่ set ขนาดของ Layout ให้ตายตัวละครับ 
|
 |
 |
 |
 |
Date :
2009-11-18 11:51:40 |
By :
aknueng |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ปรกติ คิดว่าใช้วิธีเปลี่ยน style sheet ก็คือมีการเซตขนาดฟอนต์ใน css แต่ละไฟล์ตามใจ แล้วใช้ js เอา คือเปลี่ยนได้ทั้งเลย์เอาท์ ของพวก คลาสต่างๆ ได้ตามต้องการเลย คือต้องเขีย css แต่ละแบบเฉพาะ
ตย.
<link href="style.css" rel="stylesheet" type="text/css" id="l_css" />
<script type="text/javascript">
var css_s = {M: 'style.css', S: 'style_s.css', L: 'style_l.css'}
function changeCSS(size)
{
var new_css = css_s[size];
document.getElementById('l_css').href = new_css;
}
</script>
<a href="javascript: changeCSS('L')">L</a>
ประมาณนี้มั้งคับ ไม่ได้ลองนะคับ
|
 |
 |
 |
 |
Date :
2009-11-18 12:11:05 |
By :
pjgunner |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
แสดงjavascript คอนโทรลขนาดใน body
Code (PHP)
<style>
body{
font-size:medium; /* ถ้า body มีการปรับเปลี่ยนขนาด ตัวอื่นใน body ก็จะถูกเปลี่ยนไปด้วย*/
}
#p1{
font-size:1.5em; /* em คือกำลังขยายตัวอักษร 1.5 em คือ 1.5 เท่า*/
}
#p2{
font-size:.5em;
}
</style>
<script>
function setSize(size){
document.body.style.fontSize=size;
}
</script>
<body>
font<br/>
<p id="p1">font</p>
<p id="p2">tont</p>
<input type="button" value="small" onclick="setSize('small')">
<input type="button" value="medium" onclick="setSize('medium')">
<input type="button" value="large" onclick="setSize('large')">
</body>
|
 |
 |
 |
 |
Date :
2009-11-18 12:17:21 |
By :
xbeginner01 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
กระทู้นี้ เป็นประโยชน์จริงๆ Thankๆๆ 
|
 |
 |
 |
 |
Date :
2009-11-18 13:29:50 |
By :
panyapol |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ขอบคุณค่ะ
ปกติใช้ CSS เฉพาะฟอนต์อย่างเดียวค่ะ ยังไม่เคยทำให้มันปรับเปลี่ยนขนาด S M L แต่ที่อธิบายให้ฟัง ก็พอจะจับทิศได้ค่ะ
ขอถามเพิ่มเติมค่ะ
1. ขอคำแนะนำเกี่ยวกับการกำหนด Layout ด้วย CSS หน่อยค่ะ
2. ใช้ javascript เป็นตัวคอนโทรล ใช้ยังเหรอ รบกวนช่วยอธิบายหน่อยค่ะ
3. อันนี้เป็นภาพคราวๆ น่ะ คืออยากทำเว็บให้มันมีหน้าตาแบบนี้ ซึ่งปกติ ถ้าใช้ตารางในการวาด มันก็สามารถทำได้ไม่ยาก แต่ถ้าเราจะใช้ CSS ในการทำ Layout+เมนู+ฟอนต์ที่ปรับเปลี่ยนขนาดได้ เราจะต้องกำหนดยังไงค่ะ รบกวนขอคำแนะนำด้วยค่ะ

ขอบคุณค่ะ
|
 |
 |
 |
 |
Date :
2009-11-18 13:34:12 |
By :
it53008 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ใช้ javascript เป็นตัวคอนโทรล ก็คือ ใช้ javascript เป็นตัวปรับขนาดนะแหล่ะครับ  
ลองศึกษา css เยอะๆครับ บอกยากว่าเขียน layout ด้วย css ยังไงเพราะมีหลายเทคนิค และรูปแบบ layout ก็มีต่างกันมากมาย   
ถ้าไม่คล่องกับ css ก็ใช้ property HTML ธรรมดาๆนี้ก็ได้ครับ
ส่วนตารางแต่ก่อนผมใช้ css เขียนทั้งหมดตั้งแต่สร้างเลย แต่หลังๆค่อนข้างน่าเบื่อครับ ก็เลยกลับมาใช้ tag table html ธรรมดานี้แหล่ะครับ ส่วนตรงไหนอยากกำหนดเพิ่มก็แทรก css เข้าไปจะง่ายกว่า
|
 |
 |
 |
 |
Date :
2009-11-18 14:05:33 |
By :
xbeginner01 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
|
|
|

|
Load balance : Server 03
|