HTML Basic
สำหรับนักพัฒนาเว็บไซต์มือใหม่ HTML , CSS และการใช้ Tools ต่างๆ ในการพัฒนาเว็บไซต์
Moderator: mindphp
-
hayatee
- PHP Super Hero Member
- โพสต์: 670
- ลงทะเบียนเมื่อ: 19/04/2021 10:01 am
โพสต์ที่ยังไม่ได้อ่าน
โดย hayatee »
- HTML CSS-1.png (15.21 KiB) Viewed 3322 times
โค้ด: เลือกทั้งหมด
<div class="col-md-4" >
<span class ="Rectangle3">ส่งข้อความ</span>
<span class ="Rectangle3-1 ">ติดตาม</span>
</div>
โค้ด: เลือกทั้งหมด
.Rectangle3{
position: absolute;
width: 130px;
height: 30px;
left: 0px;
top: 0px;
/* SD50 */
border: 1px solid #DADADA;
border-radius: 2px;
position: absolute;
width: 81px;
height: 20px;
left: 30px;
top: 6px;
font-family: Kanit;
font-style: normal;
font-weight: normal;
font-size: 18px;
line-height: 38px;
/* identical to box height */
text-align: center;
/* P100 */
color: #272522;
}
.Rectangle3-1{
position: absolute;
top: 100px;
background: 1px solid#7FB036;
border-radius: 2px;
color: #FFFFFF;
text-align: center;
padding-top: 1.5%;
left: 1260px;
padding-top: 4px;
padding-bottom: 4px;
width: 130px;
height: 30px;
font-family: Kanit;
font-style: normal;
font-weight: normal;
font-size: 18px;
line-height: 37px;
text-align: center;
color: #FFFFFF;
}
-
eange08
- PHP VIP Members
- โพสต์: 16184
- ลงทะเบียนเมื่อ: 22/12/2020 10:09 am
โพสต์ที่ยังไม่ได้อ่าน
โดย eange08 »
- ให้ลบคำสั่ง css ที่มีกันซ้ำๆ ให้ใช้ค่าใดค่าหนึ่ง ไม่อย่างนั้นจะไม่แสดงผลหรือแสดงเพี้ยน เช่น
.Rectangle3 จะมีให้เลือกใช้อย่างใดอย่างหนึ่ง
โค้ด: เลือกทั้งหมด
width: 130px;
height: 30px;
width: 81px;
height: 20px;
.Rectangle3-1
- ถ้าให้ตัวอักษรอยู่ตรงกลางให้ใช้คำสั่ง padding-top: 10px; แล้วกำหนดตำแหน่ง
-
eange08
- PHP VIP Members
- โพสต์: 16184
- ลงทะเบียนเมื่อ: 22/12/2020 10:09 am
-
mindphp
- ผู้ดูแลระบบ MindPHP
- โพสต์: 41232
- ลงทะเบียนเมื่อ: 22/09/2008 6:18 pm
-
ติดต่อ:
โพสต์ที่ยังไม่ได้อ่าน
โดย mindphp »
พยายามให้หน่วยในกรอปที่เป็นสัดส่วน หรือ จำนวนเท่า จะทำให้ template ดูดีเมื่อขนาดหน้าจอเปลี่ยน เช่นจาก 1280,13xx, 14xx
-
-
- 2 ตอบกลับ
- 1707 แสดง
-
โพสต์ล่าสุด โดย AePongsak
01/08/2018 6:38 pm
-
-
- 2 ตอบกลับ
- 1704 แสดง
-
โพสต์ล่าสุด โดย hayatee
14/06/2021 5:34 pm
-
-
- 2 ตอบกลับ
- 400 แสดง
-
โพสต์ล่าสุด โดย Thanavat_n
23/12/2022 10:36 am
-
-
- 1 ตอบกลับ
- 666 แสดง
-
โพสต์ล่าสุด โดย tsukasaz
14/12/2022 10:51 am
-
-
- 5 ตอบกลับ
- 1615 แสดง
-
โพสต์ล่าสุด โดย fhakun
15/09/2020 5:05 pm
-
-
- 1 ตอบกลับ
- 541 แสดง
-
โพสต์ล่าสุด โดย mindphp
15/05/2023 10:56 pm
สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 81