Post on 21-Aug-2020
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
บทที่ 3
การใช้งานเครือ่งมือใน Dreamweaver CS เบื้องต้น วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
หัวข้อ 1. ส่วนประกอบของ Dreamweaver 2. การสร้าง Site 3. แนะนำหน้าต่าง CODE , DESIGN , SPLIT 4. การกำหนดค่าเบื้องต้นใน Dreamweaver 5. การใช้งานเคร่ืองมือ Insert 6. การใช้งานหน้าต่าง Properties 7. การจัดการข้อความ 8. การจัดการรูปภาพ 9. การสร้าง Link 10. การสร้างตาราง 11. การสร้างไฟล์ และ Save as
ชื่อ อาจารย์ ดร. นัฐพงศ์ ส่งเนียม ตำแหน่ง อาจารย์
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
สาขาวิชาวิทยาการคอมพิวเตอร์ คณะวิทยาศาสตร์และเทคโนโลยี มหาวิทยาลัยราชภัฏพระนคร
จากหน้าต่าง File ให้สร้างไฟล์ index.php ขึ้นมา ดังรูป
การค่า Encoding Ctrl + J
เลือก Title/Encoding
เลือก Thai (Windows)
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
กด OK ไป
จากน้ันไปตั้งค่า Font ในหน้าต่าง Code กด Ctrl + U
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
เลือก Font
เลือก Code View ก าหนดให้เป็น Font ทีใ่ช้ภาษาไทยได้ในหน้าต่าง Code
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
จะได้
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
ไปทีห่น้า Design
• การแทรก Table
o ทีเ่คร่ืองมือ Insert
o เลือก Table
o จะได้หน้าต่างดังนี ้
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
ROW : แถว
Column คอลัมน ์
Table Width คือความกว้าง มีหน่วยเป็น pixel หรือ %
Border Thikness ความหนาของเส้น ถ้าไม่ต้องการให้มี เส้น ก็ใส่ 0
Cell Padding คือ ระยะห่างของเส้นตารางกับข้อความ
Cell Spacing คือ ช่องว่าง หรือระยะห่างของเส้น
ให้ก าหนดตามรูปนี ้
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
กด OK จะได้
ตารางนีม้ี 3 แถว 1 คอลัมน ์ไม่มีเส้นตาราง
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
คลิกเมาสใ์นแต่ละแถว แล้ว กดแป้น Enter เพ่ือขยายความสูง คือการพิมพช์่องว่างเข้าไป
• การใส่สีในช่อง Cell
o เลือกช่องทีต่้องการ
o โดยใช้ Tag Selector
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
Tag Selector แถบทีใ่ช้ส าหรับ Tag HTML
<td> คือ Tag คอลัมน ์
<tr> คือ Tag ของแถว
<talbe> คือ ตาราง
<body> คือ ส่วนเนือ้หา
การใสส่ี ใหด้ใูนหนา้ต่าง Properties
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
ใส่สีพืน้หลังส าหรับช่อง Cell ใด ๆ
เลือกสีทีต่้องการ
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
การจดัต าแหน่งขอ้ความในช่อง Cell
เลือกช่อง Cell เลือก Propoerties Horz : Center
เลือกช่อง Cell เลือก Propoerties Vert : Middle
ให้แทรก ตารางลงในช่อง Cell บนสุด
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
จะได้
จากน้ันพิมพข์้อความลงในแต่ช่อง Cell
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
หน้าแรก ข่าว/กิจกรรม ระบบทะเบียนบุคคล ระบบเงินเดือน/โอที การพัฒนาบุคลากร ระบบภาษี ระบบการลา ติดต่อเรา
หากต้องการปรับคอลัมน ์หรือแถว ให้เลือกตาราง ดังรูป
ปรับจ านวนคอลัมน ์หรือแถว ตามต้องการ เป็น 1แถว , 8 คอลัมน ์
การปรับความสูงของช่อง Cell ใด ๆ เลือก ช่อง Cell น้ัน ๆ ทีต่้องการ
ก าหนด Height H ในหน้าต่าง Properties
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
ให้พิมพข์้อความส าหรับท า Link ในช่อง Cell ด้านล่างดังนี ้
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
ท า Link ดังนี ้
ลากเมาสค์ลุมข้อความทีต่้องการ
ก าหนด Link ในหน้าต่าง Properties
PNRU : http://www.pnru.ac.th
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
ยังไม่ Start Service
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
แทรกตาราง 1 แถว 2 คอลัมน ์
แทรกรูป และ ข้อความดังนี ้
การสร้าง ไฟล ์หน้าอื่น ๆ
- ข่าว /กิจกรรม News.php หรือ news.html
- ระบบทะเบียนบุคคล Personal_record.php
- ระบบงานเงนิเดือน/โอท ี Payrolls.php
- ระบบการลา - ระบบภาษี - ระบบฯลฯ
Save as จากไฟลเ์ดิม
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
การเพ่ิมแถวโดยการกด แป้น TAB
คลิกไปในช่อง Cell ใด แล้วกดแป้น TAB ไปเร่ือย ๆ จะได้แถวต่อท้ายจากของเดิม ดังนี ้
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
การเว้นช่องว่างใน Dream …. Ctrl + Shift + Space Bar ( )
บันทกีไฟลข์่าว ตามวันที ่Save as file News_24_11_2562.php Save as file News_23_11_2562.php Save as file News_22_11_2562.php
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
POINT TO File
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
- Link ภายในเว็บไซต ์
- Link ระหว่างเว็บไซต ์
- Link ภายในเพจเดียวกัน
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
หนา้ทะเบียนบคุคล Personal_Record.php
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
การลบแถว ถ้าไม่ต้องการแถวใด หรือต้องการลบออกไป
- คลิกเมาสข์วา - เลือก Table
- เลือก Delete Row
ทะเบียนประวติั
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
แทรก ตาราง 1 แถว 4 คอลัมน ์
แล้วพิมพ ์ข้อความดังนี ้
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
โดยปกติ เราจะบันทกึ ข้อมูลประวัติพนักงานลงฐานข้อมูล
จะมี ตาราง
- ประวัติพนักงาน
- ประวัติการลา
- ประวัติการศึกษา
- ประวัติการท างาน
TbEmployee
รหสัพนกังาน ค าน าหนา้ ชื่อ นามสกลุ เพศ ต าแหน่ง เบอรโ์ทร ที่อยู่ รูป ... Emp000001
Data Dictionary
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)
ทะเบียนบุคคล
1. รับสมัคร
2. ก าหนดต าแหน่ง / ก าหนดเงนิเดือน
3. เล่ือนขั้น
4. อบรม
5. ลา
6. ให้พ้นต าแหน่ง
7. ลาออก
Save as เป็นไฟลช์ื่อ Personal_Record_Person_dep.php เป็นหน้ารายชื่อพนักงานฝ่ายบุคคล
Save as เป็นไฟลช์ื่อ Personal_Record_Account_dep.php เป็นหน้ารายชื่อพนักงานฝ่ายบัญชี
วิชาโปรแกรมประยุกต์ด้านทะเบียนบุคคลและการจ่ายเงินเดือน (4123645)