ยินดีต้อนรับคุณ, บุคคลทั่วไป กรุณา เข้าสู่ระบบ หรือ ลงทะเบียน

เข้าสู่ระบบด้วยชื่อผู้ใช้ รหัสผ่าน และระยะเวลาในเซสชั่น

ThaiSEOBoard.comพัฒนาเว็บไซต์Programmingถามเซียน CSS ..ภาพโปร่งใสกับตัวหนังสือ..▓ ★
หน้า: [1]   ลงล่าง
พิมพ์
ผู้เขียน หัวข้อ: ถามเซียน CSS ..ภาพโปร่งใสกับตัวหนังสือ..▓ ★  (อ่าน 5609 ครั้ง)
0 สมาชิก และ 1 บุคคลทั่วไป กำลังดูหัวข้อนี้
เป็นติ่งไรเนี่ย
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 66
ออฟไลน์ ออฟไลน์

กระทู้: 1,208



ดูรายละเอียด
« เมื่อ: 25 มกราคม 2010, 20:04:04 »

ให้เเบ็ดกราวน์เป็นรูปภาพ โดยลดภาพให้มันซีด โค๊ดประมาณนี้คับ (ie,firefox)
filter: alpha(opacity=25);
   -moz-opacity:.65;
แต่ว่า มันทําให้ตัวหนังสือที่เขียนบนพื้นเเบ็ดกราวน์มันซีดจางตามไปด้วย
ไม่ทราบต้องเเก้ไงคับ ให้มันเข้มดํา ไม่ซีดตามกันไป..
( ใส่ color: #000; ก็ยังเหมือนเดิม )

โค๊ด..
โค๊ด:
#abc {
background-image: url(../Attractions/maehongson.jpg);
background-repeat: no-repeat;
filter: alpha(opacity=25);
-moz-opacity:.65;
opacity:.65;
color: #000;
}
บันทึกการเข้า
Synchronize
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 83
ออฟไลน์ ออฟไลน์

กระทู้: 1,231



ดูรายละเอียด
« ตอบ #1 เมื่อ: 25 มกราคม 2010, 20:51:09 »

เงื่อนไขที่คุณต้องการนั้น ไม่ได้อยู่ที่ CSS ครับ อยู่ที่ภาพ background ต่างหาก
ใช้ photoshop เอาภาพที่ใช้ไปทำให้ซีดด้วยการลด opacity
แล้ว save เป็น png ค่อยเอามาใช้น่ะครับ

 wanwan017
บันทึกการเข้า

whitecross
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 129
ออฟไลน์ ออฟไลน์

กระทู้: 2,063



ดูรายละเอียด
« ตอบ #2 เมื่อ: 25 มกราคม 2010, 21:44:26 »

ขอออกตัวก่อนนะครับว่าผมไม่ชำนาญ CSS สักเท่าไหร่ แต่ปัจจุบันทำงานฟรีแลนซ์เว็บดีไซน์ต้องใช้ทกวัน -*- เลยคิดว่าน่าจะช่วยคุณได้

คำถาม : ทำไมตัวหนังสือบน BG มันใสตาม BG ?

คำตอบ : คุณนำตัวหนังสือวางไว้ใน Tag ของ css abc เช่น ...

EX 1 : <div id="abc">ข้อความของคุณ</div>
---> ตัวหนังสือได้รับผลของ Tag css abc ด้วยครับ

EX 2 : <div id="abc"><h1>ข้อความของคุณ</h1></div>
---> ถึงมี Tag อื่นครอบไว้ ซึ่งกำหนด h1 ไม่ให้ใสแล้ว มันก็ยังโดนผลอยู่ครับ เพราะว่า Tag h1 ยังอยู่ใน Tag css abc อยู่

วิธีแก้ปัญหา : ผมทดลองมาให้แล้วครับ แต่ไม่แน่ใจว่าเครื่องคุณจะเห็นเหมือนผมไหมนะครับ ...

HTML ...
<div id="abc"><div id="text">1234567890</div></div>

CSS ...
#text {
   width:400px;
   height:300px;
   position:absolute;
   margin:0 0 0 0
}
#abc {
   background-image: url(../images/bg10.gif);
   width:400px;
   height:300px;
   filter: alpha(opacity=25);
   -moz-opacity:.65;
   opacity:.65;
}

เมื่อดู Code HTML แล้ว เราจะเห็นว่า เอ๊ะ มันก็ยังมี Tag css ชื่อ Text อยู่ใน Tag css abc แต่ทำไมมันไม่ใสล่ะ ?

เหตุผล : ผมใช้  position:absolute; ทำให้ข้อความของผมไม่ได้ "วาง" อยู่ข้างบน BG แต่มัน "ลอย" อยู่ข้างบนต่างหาก ^^


ปล. มีปัญหาอะไรเกี่ยวกับเว็บดีไซน์ปรึกษาได้นะครับ ช่วยๆกัน ^^


Contact MSN or Mail : [email protected] / 081-138-9006 ขอสาย "โอม"
บันทึกการเข้า

บริการออกแบบเว็บไซต์ / PSD 2 HTML / Tableless Generation / W3C Validation / Graphic Design
ติดต่อสอบถามข้อมูลต่างๆทางอีเมล์ได้เลยครับผม...
หน้า: [1]   ขึ้นบน
พิมพ์