ປ້າຍໂຄສະນາແບບອັກສອນທຽບກັບແບບເອກະສານແບບ Cascading (CSS)

ທ່ານໄດ້ເບິ່ງຢູ່ໃນເວັບໄຊທ໌ທີ່ມີອາຍຸຫຼາຍແລະໄດ້ເຫັນໂຄດຄໍາສັ່ງຜິດປົກກະຕິພາຍໃນ HTML ໄດ້ ບໍ? ຫລາຍປີທີ່ຜ່ານມາຜູ້ອອກແບບເວັບຈະກໍານົດຕົວອັກສອນຂອງຫນ້າເວັບຂອງເຂົາເຈົ້າພາຍໃນເອກະສານ HTML ແຕ່ວ່າການແຍກຂອງໂຄງສ້າງ (HTML) ແລະແບບ (CSS) ອອກໄປປະຕິບັດນີ້ບາງຄັ້ງກ່ອນຫນ້ານີ້.

ໃນການອອກແບບເວັບໄຊທ໌໌ໃນມື້ນີ້, ໂຄດຄໍາສັ່ງໄດ້ຖືກປະຕິເສດ. ນີ້ຫມາຍຄວາມວ່າໂຄດຄໍາສັ່ງບໍ່ແມ່ນສ່ວນຫນຶ່ງຂອງຂໍ້ກໍານົດ HTML. ໃນຂະນະທີ່ບາງຕົວທ່ອງເວັບຍັງສະຫນັບສະຫນູນແທໍກນີ້ຫລັງຈາກທີ່ໄດ້ຮັບການສະຫນັບສະຫນູນ, ມັນບໍ່ໄດ້ຮັບການສະຫນັບສະຫນູນໃນ HTML5 ເຊິ່ງເປັນການເລີ້ມເທື່ອໃຫມ່ຂອງພາສາ. ນີ້ຫມາຍຄວາມວ່າໂຄດຄໍາສັ່ງບໍ່ຄວນຢູ່ໃນເອກະສານ HTML ຂອງທ່ານ.

ທາງເລືອກກັບປ້າຍໂຄສະນາ

ຖ້າທ່ານບໍ່ສາມາດກໍານົດຕົວອັກສອນຂອງຂໍ້ຄວາມພາຍໃນຫນ້າ HTML ທີ່ມີໂຄດຄໍາສັ່ງ, ທ່ານຄວນໃຊ້ຫຍັງ? ຮູບແບບ Cascading (CSS) ແມ່ນເຮັດແນວໃດທ່ານກໍານົດຮູບແບບຂອງຕົວອັກສອນ (ແລະຮູບແບບຕ່າງໆ) ໃນເວັບໄຊທ໌ມື້ນີ້. CSS ສາມາດເຮັດສິ່ງດຽວກັນທີ່ປ້າຍໂຄສະນາສາມາດເຮັດໄດ້, ລວມທັງຫຼາຍ. ໃຫ້ກວດເບິ່ງສິ່ງທີ່ແທັກສາມາດເຮັດໄດ້ໃນເວລາທີ່ມັນເປັນທາງເລືອກສໍາລັບຫນ້າ HTML ຂອງພວກເຮົາ (ຈື່ໄວ້, ມັນບໍ່ໄດ້ຮັບການສະຫນັບສະຫນູນຢູ່ຕະຫລອດເວລາໃດກໍ່ຕາມ, ດັ່ງນັ້ນມັນບໍ່ແມ່ນທາງເລືອກ) ແລະປຽບທຽບວິທີເຮັດມັນດ້ວຍ CSS.

ການປ່ຽນແປງຄອບຄົວຕົວອັກສອນ

ໃບຫນ້າຂອງຕົວອັກສອນແມ່ນໃບຫນ້າຫລືຄອບຄົວຂອງຕົວອັກສອນ. ມີແທັບ font, ທ່ານຈະໃຊ້ຄຸນລັກສະນະ "ໃບຫນ້າ" ແລະທ່ານຈໍາເປັນຕ້ອງຈັດວາງແບບນີ້ຕະຫຼອດເອກະສານ, ຫຼາຍຄັ້ງເພື່ອກໍານົດຕົວອັກສອນຕ່າງໆສໍາລັບແຕ່ລະສ່ວນຂອງຂໍ້ຄວາມ. ຖ້າທ່ານຈໍາເປັນຕ້ອງເຮັດການປ່ຽນແປງຢ່າງກວ້າງຂວາງໃນຕົວອັກສອນນັ້ນ, ທ່ານຕ້ອງປ່ຽນທຸກໆລະຫັດຕ່າງໆເຫຼົ່ານັ້ນ. ຍົກ​ຕົວ​ຢ່າງ:

ຕົວອັກສອນນີ້ບໍ່ແມ່ນ sans-serif

ໃນ CSS ແທນທີ່ຈະ font "face", ມັນເອີ້ນວ່າ font "family". ທ່ານຂຽນແບບ CSS ທີ່ຈະກໍານົດຕົວອັກສອນ. ຕົວຢ່າງ: ຖ້າທ່ານຕ້ອງການກໍານົດຂໍ້ຄວາມທັງຫມົດໃນຫນ້າເວັບໃຫ້ Garamond, ທ່ານອາດຈະເພີ່ມແບບເບິ່ງຄືວ່າ:

body {font-family: Garamond, Times, serif }

ແບບ CSS ນີ້ຈະໃຊ້ຄອບຄົວຕົວອັກສອນຂອງ Garamond ກັບທຸກສິ່ງທຸກຢ່າງຢູ່ໃນຫນ້າເວັບເນື່ອງຈາກທຸກໆອົງປະກອບໃນເອກະສານແມ່ນລູກຫລານຂອງ

ການປ່ຽນແປງສີຂອງຕົວອັກສອນ

ເຊັ່ນດຽວກັນກັບໃບຫນ້າ, ທ່ານໃຊ້ຄຸນລັກສະນະ "ສີ" ແລະລະຫັດ hex ຫຼືຊື່ສີເພື່ອປ່ຽນສີຂອງຂໍ້ຄວາມຂອງທ່ານ. ປີກ່ອນຫນ້ານີ້ທ່ານກໍ່ຈະຕັ້ງຄ່ານີ້ເປັນສ່ວນບຸກຄົນກ່ຽວກັບອົງປະກອບຂອງຂໍ້ຄວາມ, ເຊັ່ນ: ຫົວຂໍ້ຫົວຂໍ້.

ຕົວອັກສອນນີ້ແມ່ນສີມ່ວງ

ມື້ນີ້, ທ່ານຈະຂຽນເສັ້ນຂອງ CSS.

ນີ້ແມ່ນມີຄວາມຍືດຫຍຸ່ນຫຼາຍ. ຖ້າທ່ານຕ້ອງການປ່ຽນແປງ

ໃນທຸກໆຫນ້າຂອງເວັບໄຊທ໌ຂອງທ່ານ, ທ່ານສາມາດເຮັດໃຫ້ມີການປ່ຽນແປງໃນໄຟລ໌ CSS ຂອງທ່ານແລະທຸກໆຫນ້າທີ່ໃຊ້ໄຟລ໌ນັ້ນຈະໄດ້ຮັບການປັບປຸງ.

ອອກມີເກົ່າ

ການໃຊ້ CSS ເພື່ອກໍານົດຮູບແບບທີ່ມີຮູບແບບໄດ້ເປັນມາດຕະຖານຂອງຜູ້ອອກແບບເວັບຫລາຍປີ, ດັ່ງນັ້ນຖ້າທ່ານກໍາລັງເບິ່ງຫນ້າທີ່ຍັງໃຊ້ແທັກແລ້ວ, ມັນເປັນຫນ້າເກົ່າຫຼາຍແລະມັນຕ້ອງໄດ້ຮັບການພັດທະນາໃຫມ່ທີ່ສອດຄ່ອງກັບເວັບໄຊທ໌ປັດຈຸບັນ ການອອກແບບທີ່ດີທີ່ສຸດແລະມາດຕະຖານເວັບທີ່ທັນສະໄຫມ.

ແກ້ໄຂໂດຍ Jeremy Girard