การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

สอบถามปัญหา อยากแก้ไข การแสดงผลของบอร์ด เช่นเปลี่ยน Logo โทนสี ทำลิงค์เมนูเพิ่มเติม และ อื่นๆ ที่เกี่ยวกับ Styles การแก้ไขรูป ปุ่ม สี การเปลี่ยนหน้าตาบอร์ด

Moderator: phpbb, mindphp, ผู้ดูแลกระดาน

malongdoo
phpBBThailand Full Member
phpBBThailand Full Member
โพสต์: 33
ลงทะเบียนเมื่อ: 07 ธ.ค. 2009, 14:05

การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย malongdoo » 09 ธ.ค. 2009, 16:11

สวัสดีค่ะ
จากที่ได้ทดลองเปลี่ยนสี พื้นหลัง(สีขาว) เปลี่ยนสี พื้นของบอร์ด (สีฟ้า) แล้วได้สังเกตุเห็นว่า
เมื่อเปลี่ยนสีพื้นหลัง(สีขาว)เป็นสีอื่น ตรงมุน ของพื้นบอร์ด จะมีสีขาวเล็กๆ อยู่ที่มุมทั้งสี

ได้พยายามหากระทู้ที่เกี่ยวข้องแล้ว แต่ว่าหาไม่เจอค่ะ ต้องขออภัยจริงๆ นะคะ

คำถาม เราสามารถแก้ไข สีตรงส่วนนั้นได้หรือป่าวคะ หากแก้ไขได้ ต้องแก้ที่ไฟล์ไหนคะ
ถามอีกข้อนะคะ คือสีพื้นบอร์ด ทีเ่ป็นสีแต่ละหัวข้อ สีฟ้าอ่อนๆ เวลาเอาเมาส์ไปชี้จะเปลี่ยนเป็นสีเหลือง เปลี่ยนสีได้จาก ไฟล์ไหนคะ

รบกวนด้วยนะคะ

ขอบคุณค่ะ

F0rG0ttenZ0ne
phpBBThailand VIP Members
phpBBThailand VIP Members
โพสต์: 1473
ลงทะเบียนเมื่อ: 22 ม.ค. 2009, 06:56

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย F0rG0ttenZ0ne » 09 ธ.ค. 2009, 17:01

เคยตอบไปแล้วแต่ไมไช่กระทุ้ถามโดยตรง

ตรงมุมๆสามารถเปลี่ยนได้

1. นำรุปไปแก้สีขอบให้สีเดียวกับพิ้นของบอร์ดและอัพโฆลดไปใหม่
2. ลบ tag นี้ออกไป แตถ้าลบขอบจะไม่โค้งนะ

<div class="inner"><span class="corners-top"><span></span></span>
............

<span class="corners-bottom"><span></span></span></div>



หรือไปแก้ใน CSS ก็ได้ น่าจะอยุ่ใน content.css หรือ common.css ไม่แน่ใจ ดูคลาสพวกนี้ corners-bottom span , inner span
แถวๆนี้ครับ

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

สว่นสีแบคกราวของบอร์ดที่เป็นสีฟ้า หรือ เหลืองๆ ตอนเอาเมาส์ไปวาง จำ คลาสและไฟล์ไม่ได้ ลองวิวซอสและหาดูนะ

แถวๆ ที่มี :hover ต่อท้าย
FAQ ปัญหาการใช้งาน การตั้งค่า กรุณาอ่านก่อนตั้งคำถาม*
ใครไม่มาโพสปิดกระทู้ ต้องขออภัยที่ผมไม่สามารถช่วยท่านได้ในโอกาสต่อไป
ถ้ามีใน FAQ อาจไม่ได้รับคำตอบ

เมื่อได้รับคำตอบแล้วเข้ามา โพสบอกด้วยครับว่าได้หรือไม่ได้

malongdoo
phpBBThailand Full Member
phpBBThailand Full Member
โพสต์: 33
ลงทะเบียนเมื่อ: 07 ธ.ค. 2009, 14:05

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย malongdoo » 09 ธ.ค. 2009, 17:55

ขอบคุณค่ะ อาจารย์
จะพยายามค้นคว้าหาความรู้ค่ะ ^^

ได้ผลยังไงจะมารายงานนะคะ

malongdoo
phpBBThailand Full Member
phpBBThailand Full Member
โพสต์: 33
ลงทะเบียนเมื่อ: 07 ธ.ค. 2009, 14:05

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย malongdoo » 09 ธ.ค. 2009, 20:57

เปลี่ยนพื้นตรงขอบได้แล้วค่ะ

แต่ว่าเปลี่ยนสีตรง บอร์ด หาไม่เจอค่ะ

F0rG0ttenZ0ne
phpBBThailand VIP Members
phpBBThailand VIP Members
โพสต์: 1473
ลงทะเบียนเมื่อ: 22 ม.ค. 2009, 06:56

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย F0rG0ttenZ0ne » 09 ธ.ค. 2009, 22:24

เปิดไฟล์ theme/colours.css

โค้ด: เลือกทั้งหมด

.forabg {
   background-color: #0076b1;
   background-image: url("{T_THEME_PATH}/images/bg_list.gif");
}

.forumbg {
   background-color: #12A3EB;
   background-image: url("{T_THEME_PATH}/images/bg_header.gif");
}


ดูตรง forgabg นะ จะเป็นสีพิ้นของบอร์ดที่เป็นสีน้ำเงิน จริงๆมันเป็นรุปและมีสีพิ้นอยุ่ด้านหลังรูป

ส่วน forumbg ก็ลองทดสอบดูเอาว่ามันควบคุมส่วนไหนของบอร์ด
FAQ ปัญหาการใช้งาน การตั้งค่า กรุณาอ่านก่อนตั้งคำถาม*
ใครไม่มาโพสปิดกระทู้ ต้องขออภัยที่ผมไม่สามารถช่วยท่านได้ในโอกาสต่อไป
ถ้ามีใน FAQ อาจไม่ได้รับคำตอบ

เมื่อได้รับคำตอบแล้วเข้ามา โพสบอกด้วยครับว่าได้หรือไม่ได้

malongdoo
phpBBThailand Full Member
phpBBThailand Full Member
โพสต์: 33
ลงทะเบียนเมื่อ: 07 ธ.ค. 2009, 14:05

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย malongdoo » 09 ธ.ค. 2009, 23:51

ขอบคุณ อาจารย์ มากค่ะ ที่ชี้แนะ
จะทดสอบดูนะคะ

malongdoo
phpBBThailand Full Member
phpBBThailand Full Member
โพสต์: 33
ลงทะเบียนเมื่อ: 07 ธ.ค. 2009, 14:05

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย malongdoo » 10 ธ.ค. 2009, 12:10

อาจารย์คะ จากโค๊ดที่ให้มา ได้ทดสอบดูแล้วนะคะ

โค้ด: เลือกทั้งหมด

.forabg {
   background-color: #0076b1;
   background-image: url("{T_THEME_PATH}/images/bg_list.gif");
}

.forumbg {
   background-color: #12A3EB;
   background-image: url("{T_THEME_PATH}/images/bg_header.gif");
}


มันเป็นส่วนนอกค่ะ ไม่ใช่ตรงส่วนด้านใน^^

F0rG0ttenZ0ne
phpBBThailand VIP Members
phpBBThailand VIP Members
โพสต์: 1473
ลงทะเบียนเมื่อ: 22 ม.ค. 2009, 06:56

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย F0rG0ttenZ0ne » 10 ธ.ค. 2009, 12:32

พวกดานใน หรือเอาเมส์ชี้ล้วเปลียนสีมันอยุ่ที่

li dd หรือ dt ลองหาดู และก็ไม่ได้บอกด้วยนะว่ามันด้านใน แค่บอกว่า ตรงบอร์ดส่วนที่เป็นสีน้ำเงิน

แบบนี้ดีกว่า เดี๋ยวสรุปให้

ตรงมุมที่เป็นขาวๆ

html code

โค้ด: เลือกทั้งหมด

<div class="inner"><span class="corners-top"><span></span></span>
 .....
<span class="corners-bottom"><span></span></span></div>


colours.css

โค้ด: เลือกทั้งหมด

span.corners-top {
   background-image: url("{T_THEME_PATH}/images/corners_left.png");
}

span.corners-top span {
   background-image: url("{T_THEME_PATH}/images/corners_right.png");
}

span.corners-bottom {
   background-image: url("{T_THEME_PATH}/images/corners_left.png");
}

span.corners-bottom span {
   background-image: url("{T_THEME_PATH}/images/corners_right.png");



ส่วนที่เป็นพิ้นสีฟ้าเราจะเห็นเป็นขอบ

Template ---> forumlist_body.html

โค้ด: เลือกทั้งหมด

<div class="forabg">
....
</div>


CSS ---> colours.css

โค้ด: เลือกทั้งหมด

.forabg {
   background-color: #0076b1;
   background-image: url("{T_THEME_PATH}/images/bg_list.gif");
}

.forumbg {
   background-color: #12A3EB;
   background-image: url("{T_THEME_PATH}/images/bg_header.gif");
}


ส่วนที่เป็นสีเหลืองด้านในเวลานำเมาส์ไปชี้

Template ---> forumlist_body.html

โค้ด: เลือกทั้งหมด

<li class="row">
...
</li>


CSS ---> colours.css

โค้ด: เลือกทั้งหมด

li.row:hover {
   background-color: #F6F4D0;
}



เส้นขอบสีเทาๆ

CSS ---> colours.css

โค้ด: เลือกทั้งหมด

li.row:hover dd {
   border-left-color: #CCCCCC;
}

.rtl li.row:hover dd {
   border-right-color: #CCCCCC;
   border-left-color: transparent;
}



สว่นที่เป็นสีฟ้าด้านใน ไล่จากเข้มไปหาอ่อน ส่วนั้นจะเป็นรุป

Template ---> forumlist_body.html *** อาจมีไฟล์อื่นอีก

โค้ด: เลือกทั้งหมด

<ul class="topiclist forums">
.....
</ul>


CSS ---> colours.css

โค้ด: เลือกทั้งหมด

ul.forums {
   background-color: #eef5f9;
   background-image: url("{T_THEME_PATH}/images/gradient.gif");
}


ส่วนบริเวณอื่นๆก็ไปทดสอบดูกันเองนะ ถ้าจะให้บอกหมดคงอีกยาว หวังว่าคงเป็นประโยชน์ต่อสมาชิกท่านอื่นด้วย ที่กำลังสนใจการปรับแต่งอยู่
ถ้าแก้ไขหรือทำตามแล้วยังไม่ได้ตามต้องการหรือยังไม่มีการเปลี่ยนแปลงลองเชคดูที่ไฟล์อื่นๆด้วยนะครับ บางที css class เดียวกันอาจอยุ่ได้หลายไฟล์

***** เขียนหนังสือขายสงสัยจะดี ฮะๆๆๆๆ
FAQ ปัญหาการใช้งาน การตั้งค่า กรุณาอ่านก่อนตั้งคำถาม*
ใครไม่มาโพสปิดกระทู้ ต้องขออภัยที่ผมไม่สามารถช่วยท่านได้ในโอกาสต่อไป
ถ้ามีใน FAQ อาจไม่ได้รับคำตอบ

เมื่อได้รับคำตอบแล้วเข้ามา โพสบอกด้วยครับว่าได้หรือไม่ได้

malongdoo
phpBBThailand Full Member
phpBBThailand Full Member
โพสต์: 33
ลงทะเบียนเมื่อ: 07 ธ.ค. 2009, 14:05

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย malongdoo » 10 ธ.ค. 2009, 14:51

^^ ขอบคุณมากค่ะอาจารย์

เขียนหนังสือขายสงสัยจะดี ฮะๆๆๆๆ


เป็นความคิดที่ดีเลยค่ะ ถ้าทำขายจะอุดหนุนนะคะ อิอิ

F0rG0ttenZ0ne
phpBBThailand VIP Members
phpBBThailand VIP Members
โพสต์: 1473
ลงทะเบียนเมื่อ: 22 ม.ค. 2009, 06:56

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย F0rG0ttenZ0ne » 10 ธ.ค. 2009, 22:28

ล้อเล่นน่ะ ยังไม่รุ้มากพอที่จะเขียนเป็นหนังสือได้ กลัวคนอ่านไม่คุ้มเงิน :mrgreen:
FAQ ปัญหาการใช้งาน การตั้งค่า กรุณาอ่านก่อนตั้งคำถาม*
ใครไม่มาโพสปิดกระทู้ ต้องขออภัยที่ผมไม่สามารถช่วยท่านได้ในโอกาสต่อไป
ถ้ามีใน FAQ อาจไม่ได้รับคำตอบ

เมื่อได้รับคำตอบแล้วเข้ามา โพสบอกด้วยครับว่าได้หรือไม่ได้

malongdoo
phpBBThailand Full Member
phpBBThailand Full Member
โพสต์: 33
ลงทะเบียนเมื่อ: 07 ธ.ค. 2009, 14:05

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย malongdoo » 14 ธ.ค. 2009, 13:47

สวัสดีค่ะอาจารย์
แหะๆ มีปัญหามาให้แก้อีกแล้วค่ะ พอดีได้ลองปรับแก้ ส่วน head เล่นๆ ดูน่ะค่ะ (ส่วนภาพมุมเล็กสี่ด้าน) ปรับไปปรับมาก็เลยเจอปัญหา
ตามโค๊ตที่อาจารย์บอกไว้

โค้ด: เลือกทั้งหมด

<div class="inner"><span class="corners-top"><span></span></span>
.....
<span class="corners-bottom"><span></span></span></div>

ถ้าหาลบโค๊ดนี่ออก ภาพเล็กๆ สีด้านจะหายไปใช่หรือป่าวคะ

ก็เลยลอง ทำดูค่ะ เพราะต้องการให้หายเฉพาะส่วน head แต่ส่วน body อยากให้เหมือนเดิม
จึงลองลบโค๊ดส่วนแรกออกค่ะ (Corners-top โค๊ตนี้ใส่สวน head มีอยู่ 3 จุดค่ะ แต่ลบจุดแรกออก) ก็สำเร็จค่ะ
มุมด้านบน หายไป เป็นที่น่าพอใจ เพราะคิดว่ามาถูกทางละ จากนั้นด้วยความั่นใจเต็มที่ จึงลบส่วนที่สอง
corers-bouttom เท่านั้นแหล่ะค่ะ ช่อง ค้นหา ก็มาอยู่หลัง [ออกระบบ/เข้าระบบ] ก็ลอง ทำอยู่หลายๆ รอบ ก็ไม่ได้
จึงต้องกลับมา รบกวนอาจารย์ อีกแล้วค่ะ ^^" ไม่รู้ว่าทำอะไรผิดไป โปรดชี้แนะด้วยนะคะ

ขอบคุณค่ะ

F0rG0ttenZ0ne
phpBBThailand VIP Members
phpBBThailand VIP Members
โพสต์: 1473
ลงทะเบียนเมื่อ: 22 ม.ค. 2009, 06:56

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย F0rG0ttenZ0ne » 14 ธ.ค. 2009, 15:05

อุตส่าตอบสะยาววว ดันเป็นหนาา้ขาวๆไปได้

สรุปแล้วกันว่าอาจไมไ่ด้ลบผิด

จริงๆลบแค่ <span> พอ <div class="inner"> ปล่อยไว้ได้ครับเพราะ <div> เป็นตัวครอบเนือ้หาทั้งหมดไว้

ลองดูนะ

เพิ่มเติม block นี้คือส่วนทีเ่ป็นสีน้ำเงินด้านบนนะ

ให้ดูตรง <div class="headerbar">

โค้ด: เลือกทั้งหมด

<div class="headerbar">
         <div class="inner"><span class="corners-top"><span></span></span>




ส่วนที่เป็นเมนู ที่เป็น ข้อความ ตั้งค่าส่วนตัว จะเริ่มจากตรงนี้

โค้ด: เลือกทั้งหมด

<div class="navbar">
         <div class="inner"><span class="corners-top"><span></span></span>




อย่าลืมนะลบแค่ <span> พอจะได้ไม่งง สำหรับคนรุ้ css จะลบหมดก็ได้ครับเพราะถ้ามีปัญหายังไงก็ปรับแต่งได้สบยอยุ่แล้ว :mrgreen:

โพสรุปมาหน่อยก็ดีนะ
FAQ ปัญหาการใช้งาน การตั้งค่า กรุณาอ่านก่อนตั้งคำถาม*
ใครไม่มาโพสปิดกระทู้ ต้องขออภัยที่ผมไม่สามารถช่วยท่านได้ในโอกาสต่อไป
ถ้ามีใน FAQ อาจไม่ได้รับคำตอบ

เมื่อได้รับคำตอบแล้วเข้ามา โพสบอกด้วยครับว่าได้หรือไม่ได้

malongdoo
phpBBThailand Full Member
phpBBThailand Full Member
โพสต์: 33
ลงทะเบียนเมื่อ: 07 ธ.ค. 2009, 14:05

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย malongdoo » 14 ธ.ค. 2009, 15:53

ขอบคุณค่า อาจารย์ จะลองปรับดูนะคะ
แหะๆ รูป พยายามโพสแล้วค่ะมันไม่ขึ้น มีข้อความว่า ไม่สามารถ....ความกว้าง ความยาว อะไรสักอย่างน่ะค่ะ
โพสแบบแนบไฟล์ ยังไงจะลองอีกรอบนะคะ

ขอบพระคุณมากค่ะ^^

malongdoo
phpBBThailand Full Member
phpBBThailand Full Member
โพสต์: 33
ลงทะเบียนเมื่อ: 07 ธ.ค. 2009, 14:05

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย malongdoo » 14 ธ.ค. 2009, 17:32

แหะๆ ลองทำดูแล้วนะคะ

จากโค๊ด

โค้ด: เลือกทั้งหมด

<div class="headerbar">
         <div class="inner"><span class="corners-top"><span></span></span>
ลบออกได้ดังนี้
<div class="headerbar">
         <div class="inner">


ทดสอบผล ภาพมุมด้านบน ซ้ายขวา หายไป

ขั้นต่อไป ลบมุมด้านล่าง
จากโค๊ด

โค้ด: เลือกทั้งหมด

<span class="corners-bottom"><span></span></span></div>

ลบออกได้ดังนี้
</div>


ผลที่ได้คือ
เหมือนเดิมค่ะ ช่องค้นหา มารวมกับส่วนด้านล่าง ต่อท้าย [ออกระบบ] - -*
ลืมบอกไปค่ะ ไม่รู้มันจะเกี่ยวกันหรือป่าว
พอดีว่าลบส่วน logo ออกน่ะค่ะ โค๊ดที่เรียกไฟล์โลโก้ออกไปเลยอ่ะค่ะ เหลือแต่ ช่อง ค้นหาไว้เฉยๆ
จะพยายามโพสภาพมาให้ดูนะคะว่า ผลที่ได้มันเป็นยังไง

ขอบคุณค่ะ

malongdoo
phpBBThailand Full Member
phpBBThailand Full Member
โพสต์: 33
ลงทะเบียนเมื่อ: 07 ธ.ค. 2009, 14:05

Re: การเปลี่ยนสีบอร์ดตรงขอบมุม 4 ด้านเล็กๆ ที่เป็นสีขาว

โพสต์โดย malongdoo » 14 ธ.ค. 2009, 17:38

อาจารย์คะ
ลบส่วน

โค้ด: เลือกทั้งหมด

<div class="inner">[u]<span class="corners-top"><span></span></span>[/u]


ภาพมุมด้านบนซ้ายขวา หายไปคะ แสดงว่า ทำถูก

แต่พอลบ

โค้ด: เลือกทั้งหมด

[b]<span class="corners-bottom"><span></span></span>[/b]</div>


ช่อง ค้นหา ก็มารวมกับ ส่วนด้านล่างค่ะ ต่อท้าย [ออกจากระบบ] - -*

ลืมบอกไปค่ะ ไม่รู้จะเกี่ยวกันหรือป่าว พอดีว่า ลบส่วนที่เป็นโค๊ต logo ออกไปน่ะค่ะ ให้เหลือไว้แต่ช่องค้นหา - -*

ดูเหมือนจะง่าย...แต่พอทำแล้วมันยากจริงๆ

พยายามโพสรูปแล้วนะคะ แต่ว่า โพสอยู่หลายรอบ มันขึ้นหน้าเพจ ขาวขึ้นมาค่ะ


ย้อนกลับไปยัง

ผู้ใช้งานขณะนี้

กำลังดูบอร์ดนี้: 13 และ บุคคลทั่วไป 0 ท่าน