css คืออะไร

จำได้มั้ย โค้ดที่น้องๆ ชอบถาม ว่า ขอโค้ดใส่ background กล่องคอมเมนต์หน่อย อะไรทำนองนี้ โค้ดเหล่านั้นที่ ใช้ ก็คือ CSS นั่นเอง จริงๆ แล้ว css ก็คือ ภาษา ที่ ใช้ในการกำหนด รูปร่างหน้าตา ของ HTML อีกทีนึง ไม่ต้องตกใจ มันไม่ได้ ยาก เพราะทางเวบเตรียม โค้ด CSS ไว้ให้เรียบร้อยแล้ว แก้ตาม อย่างเดียวเลยนะครับ พี่จะเขียนอธิบายไว้ ว่าโค้ดอะไรเป็นอะไร ตรงไหนทำอะไร

ใส่โค้ดที่นี่นะคับ


หมายเลข1 คลิกเพื่อ เข้า แฟ้ม script ส่วนตัว เพื่อไปใส่โค้ด เมื่อคลิกแล้วจะ เข้าแฟ้ม สคริป ดังรูปข้างล่างนี้




หมายเลข1 กดเพื่อเพิ่ม script เมื่อเพิ่มเสร็จแล้ว ชื่อ script จะปรากฏให้เห็นดังรูป
หมายเลข2 คลิกที่ชื่อ script เมื่อต้องการใช้งาน
หมายเลข3 คลิก เมื่อต้องการให้ script ตัวนี้ทำงานทุกวัน

นี่เป็น CSS ของ theme ในเวบ whenifallinlove อยากแก้หน้าตาก็แก้ css นี้ครับ

<style>

/*ส่วนของ Body ใส่ Bg ได้*/

body{

margin:0px;
background:url(http://www.whenifallinlove.net/diary/images_background/bg17/bg_back6.jpg); /* เปลี่ยน url เอง*/
background-attachment:fixed;

}

/*สี และขนาด ฟอนท์ตัวอักษรทั้งหน้า */
td,th,div,body,li,ul,p {

color: #000000; /*สี*/
font-size:14px; /* ขนาด font*/
font-family: 'MS Sans Serif', 'Microsoft Sans Serif',sans-serif; /* จะเปลี่ยน font ทั้งหน้า แก้ที่นี่เลย*/

}

/* กล่อง กรอกชื่อผู้คอมเมนต์ */
input{

background:url(http://www.whenifallinlove.net/diary/images_background/bg4/15648_97246.gif); /* เปลี่ยน url เอง*/

}

/* กล่อง เขียน comment */
textarea{

background:url(http://www.whenifallinlove.net/diary/images_background/bg4/15648_97246.gif); /* เปลี่ยน url เอง*/
height:100px; /* ความสูงกล่อง*/
width: 300px;/*ความกว้างกล่อง*/

}

/*------------------------ส่วนลิงค์ของตัวอักษร ------------------------*/

a:link { /* สี ตัวอักษรลิงค์ */
color: blue;
text-decoration: none;
}
a:hover { /* สี ตัวอักษรเมื่อเอา เมาส์วาง*/
color: green;
text-decoration: underline;
}
a:visited {/* สี ตัวอักษรเมื่อคลิก link แล้ว*/
color: white;
text-decoration: none;
}

/*------------------------ส่วนกล่องโชว์คนที่มาคอมเมนต์ มันจะสลับสีกัน----------------------------------------*/

/* กล่องคอมเมนต์ แรก*/
#comment1{

overflow:hidden;
width:350px; /* ความกว้างของกล่องคอมเมนต์*/
margin:10px 0px 10px 0px;
background:url(http://www.whenifallinlove.net/diary/images_background/bg4/15648_97246.gif); /* ใส่สี ใส่ bg ภาพ ได้ */


}

/* กล่องคอมเมนต์ ที่สอง*/
#comment2{

overflow:hidden;
width:350px; /* ความกว้างของกล่องคอมเมนต์*/
margin:10px 0px 10px 0px;
background:white; /* ใส สี ใส่ bg ภาพ ได้ */

}


/* table กล่องเขียนคอมเมนต์ */
#comment_box{
overflow:hidden;
width:350px;
margin:10px 0px 10px 0px;
}

#detail_comment{

text-align:left;
border:dashed 1px #FFFFFF; /* ขอบ เส้นประ*/
margin:8px 8px 8px 8px;

}

/* เนื้อหาในกล่อง คอมเมนต์ */

#detail_comment div{

margin:4px 4px 4px 4px;

}

/* ส่วนที่โชว์โลโก้ของเพื่อน */
#logo_comment{

text-align:left;
float:left;
margin:1px 4px 0px 8px;

}

/* ส่วนที่โชว์ ชื่อของคนที่คอมเมนต์*/
#name_comment{

text-align:left;
float:left;
margin:1px 8px 0px 0px;

}

/*------------- ส่วน ไอคอนหน้าหัวข้อไดอารี่ -------------*/
ul{

list-style-type: none;
margin:0 0 0 2;

}

li{

margin:0 0 0 0;
padding:0 0 2 19; /* 2 กับ 19 เปลี่ยนได้ ท่า ไอคอนมันเบี้ยวไม่ตรงหัวข้อ เพราะแต่ละไอคอนจะไม่เท่ากัน */
background:url(http://www.whenifallinlove.net/images/icon_publication.gif) no-repeat 0 0;

}

/*------------- ส่วน เปลี่ยนสี ปฏิทิน-------------*/
calendarHeader {
background:red;
}
.calendarToday {
font-weight: bold;
background:red;
}
.calendar {
border:1px solid #cccccc;
}

</style>