CSS เด็ดๆ

[iannnnn]

http://cssglobe.com/post/1392/8-premium-one-line-css-tips
8 CSS เด็ดๆ ลรรทัดเดียวเอาอยู่:


ที่เด็ดๆ ก็มี
- ใช้ line-height ทำให้ข้อความอยู่กลาง div ในแนวตั้ง
- เอา Vertical Scrollber ออกจาก Textarea ใน IE
- เวลากดลิงก์ไหนแล้วไม่มีไอ้เส้นประๆ เป็นกรอบรอบลิงก์

[ozone_me]

แจ่ม จิง อิอิ 

[ฟิ้งซ์]

เข้ามาเก็บความรู้ ขอบคุณครับ

[iannnnn]

Designer's Toolbox: Blank CSS Template
http://tutorialblog.org/designers-toolbox-blank-css-template/

ถ้าจะเริ่มออกแบบหน้าเว็บจาก 0 โดยเขียน css กำกับ
ลองนี่สิครับ เริ่มจากโ๕รงสร้างและตัวช่วยเหล่านี้
ถึงจะมีอะไรไม่มาก แต่ก็ำช่วยทำให้งานง่ายขึ้นนะเออ

ป.ล. ดูโค้ดแล้วเห็นไอ้นี่

โค้ด เลือกทั้งหมด ขยายเนื้อหา

.transpBlack { background: url(transpBlack.png); }

มันกำหนดแบบนี้ได้ด้วยเหรอ

[กันย์]

จะลดช่องว่างระหว่าง div 2 อันที่ float กันคนละข้างทำไงครับ
แบบว่า มี wrapper ห่อไว้แล้วทั้ง 2 div
มีรูปประกอบครับ



จะลดช่องตรงแดงๆนั้นยังไงครับ

[iannnnn]

ต้องอยู่ที่ว่าจะเอาไปทำอะไรอ้ะครับ

ปกติถ้าเรากำหนดความกว้างของ div ที่ float ไว้แบบนี้
ให้กำหนดความกว้างของทั้งคู่ก่อน แล้ว float:left ทั้งคู่เลย
แต่อันขวาบอกให้ margin-left เท่าๆ กะความกว้างของ div ซ้ายครับ

[กันย์]

ขอบคุณมากครับ
เดี๋ยวผมจะลอง float left ทั้งคู่ดู

อ้ะ ลืมถามไปเรื่องนึง
พอจะมีวิธีสุ่มรูปที่แสดงในหน้าเว็บได้หรือเปล่าครับ
แบบที่ว่า เรากำหนดรูปไว้ 4-5 แบบ แล้วมันก็จะสุ่มเลยว่าเข้าแต่ละครั้งๆจะเจอรูปไม่เหมือนกัน

[i-poon]

css ทำไม่เป็น แต่ถ้าใช้ php ได้ก็ตามนี้ครับ

ส่วนแรกใส่ไว้บนๆของหน้า

โค้ด เลือกทั้งหมด ขยายเนื้อหา


<?
$image = array ("image1.jpg","image2.gif","image3.png"); //ชื่อfile ที่จะให้ random ออกมา เพิ่มได้ลดได้
$image_max = count($image)-1;
$image_show = $image[rand(0,$image_max)];
?>


ตรง tag img ก็ใช้ตัวนี้แทน

<img src="<? echo "$image_show" ?>">

ป.ล. ยังไม่ได้เทสนะครับ 

[กันย์]

ขอบคุณมากครับ

ผมขอถามต่อเลยนะ
จะกำหนด height ยังไงให้มันยืดตามเนื้อหาที่ใส่ไปเหรอครับ
แบบว่า ใส่ไป 800px แต่พอใส่เนื้อหาไปเกิน มันก็ล้นออกมา เลยอยากรู้ว่าใช้ค่าอะไรมันจะยืดตามเหรอครับ

[Layiji]

ปกติไม่ต้องทำอะไรก็ยืดเองอยู่แล้วนะครับ แต่ว่าถ้ามีสูงอย่างต่ำ
ก็ใช้ min-height เอาครับ

[iannnnn]

ไปเจอโค้ดแบบนี้มาครับ

โค้ด เลือกทั้งหมด ขยายเนื้อหา

a[href^="mailto"] {
background: url(images/emailIcon.png) left center no-repeat;
padding-left: 10px;
}

ทำให้ลิงก์ใดๆ ที่มีคำว่า "mailto:" มีลักษณะ css ตามที่กำหนด

[Layiji]

  อะไรเนี่ย

[iannnnn]

อะไรทำไม

[X11]

ไปเจอโค้ดแบบนี้มาครับ

โค้ด เลือกทั้งหมด ขยายเนื้อหา

a[href^="mailto"] {
background: url(images/emailIcon.png) left center no-repeat;
padding-left: 10px;
}

ทำให้ลิงก์ใดๆ ที่มีคำว่า "mailto:" มีลักษณะ css ตามที่กำหนด

น่าลองๆ

[Layiji]

a[href^="mailto"]

เพิ่งเคยเจอไอ้ยุบยิบแบบนี้