CSS, ຫະລື Cascading Style Sheets, ແມ່ນສິ່ງທີ່ຖືກນໍາໃຊ້ໃນການອອກແບບເວັບໄຊທ໌ທີ່ທັນສະໄຫມເພື່ອນໍາໃຊ້ເບິ່ງຮູບພາບກັບຫນ້າ. ໃນຂະນະທີ່ HTML ສ້າງໂຄງສ້າງຂອງຫນ້າເວັບແລະ Javascript ສາມາດຈັດການກັບພຶດຕິກໍາຕ່າງໆ, ເບິ່ງແລະຮູ້ສຶກວ່າເວັບໄຊທ໌ເປັນໂດເມນຂອງ CSS. ໃນເວລາທີ່ມັນມາກັບຮູບແບບເຫຼົ່ານີ້, ພວກມັນມັກຖືກນໍາໃຊ້ໂດຍໃຊ້ແຜ່ນແບບພາຍນອກ, ແຕ່ວ່າທ່ານຍັງສາມາດນໍາໃຊ້ຄໍເຕົ້າໄຂ່ທີ່ CSS ເປັນອົງປະກອບດຽວ, ໂດຍໃຊ້ສິ່ງທີ່ເອີ້ນວ່າ "ຮູບແບບພາຍໃນ".
ຄໍເຕົ້າໄຂ່ໃນເສັ້ນແມ່ນຄໍເຕົ້າໄຂ່ທີ່ CSS ທີ່ຖືກນໍາໃຊ້ໂດຍກົງໃນ HTML ຂອງຫນ້າ. ມີຂໍ້ດີແລະຂໍ້ເສຍປຽບຕໍ່ວິທີການນີ້. ຫນ້າທໍາອິດ, ໃຫ້ເບິ່ງວ່າວິທີການເຫຼົ່ານີ້ຖືກຂຽນໄວ້.
ວິທີການຂຽນແບບ Inline
ເພື່ອສ້າງແບບ CSS ໃນເສັ້ນ, ທ່ານຈະເລີ່ມຕົ້ນໂດຍການຂຽນຄຸນລັກສະນະແບບຂອງທ່ານຄ້າຍຄືກັບວ່າທ່ານຈະຢູ່ໃນຮູບແບບໃດ, ແຕ່ມັນຕ້ອງເປັນເສັ້ນດຽວ. ແຍກຄຸນສົມບັດຫຼາຍດ້ວຍ semicolon ເຊັ່ນດຽວກັນກັບທ່ານຈະຢູ່ໃນເອກະສານສະໄຕ.
ພື້ນຫລັງ: #ccc; color: #fff border: solid black 1px
ວາງແຖວຂອງຄໍເຕົ້າໄຂ່ທີ່ຢູ່ໃນລັກສະນະຂອງອົງປະກອບຂອງອົງປະກອບທີ່ທ່ານຕ້ອງການ. ຕົວຢ່າງ: ຖ້າທ່ານຕ້ອງການນໍາໃຊ້ແບບນີ້ໃຫ້ເປັນວັກໃນ HTML ຂອງທ່ານ, ອົງປະກອບນັ້ນຈະເບິ່ງຄືວ່ານີ້:
ໃນຕົວຢ່າງນີ້, ຫຍໍ້ຫນ້ານີ້ຈະປາກົດຢູ່ກັບພື້ນຫລັງສີຂີ້ເຖົ່າເບື້ອງຂວາ (ເປັນສິ່ງທີ່ #ccc ຈະສະແດງ), ຂໍ້ຄວາມສີດໍາ (ຈາກ # 000 ສີ) ແລະມີຂອບປະກອບສີດໍາທີ່ມີຄວາມຫນາ 1 ຈຸດປະມານສີ່ດ້ານຂອງວັກ ທີ່ຢູ່
ຂໍ້ໄດ້ປຽບຂອງແບບອິນລັນ
ຂໍຂອບໃຈກັບ cascade ຂອງຄໍເຕົ້າໄຂ່ທີ່ Cascading Style String Inline ມີຄວາມສໍາຄັນຫຼືຄວາມຊໍານິຊໍານານສູງສຸດໃນເອກະສານ. ນີ້ຫມາຍຄວາມວ່າພວກເຂົາຈະຖືກນໍາໃຊ້ບໍ່ວ່າສິ່ງອື່ນໃດຖືກກໍານົດໄວ້ໃນຄໍເຕົ້າໄຂ່ທີ່ພາຍນອກຂອງທ່ານ (ມີຫນຶ່ງຂໍ້ຍົກເວັ້ນເປັນຄໍເຕົ້າໄຂ່ທີ່ໄດ້ຮັບການປະກາດທີ່ສໍາຄັນທີ່ແຜ່ນ, ແຕ່ນີ້ບໍ່ແມ່ນສິ່ງທີ່ຄວນເຮັດຢູ່ໃນບ່ອນຜະລິດຖ້າມັນ ສາມາດຫຼີກລ້ຽງໄດ້).
ຄໍເຕົ້າໄຂ່ທີ່ມີຄວາມສໍາຄັນສູງກ່ວາຮູບແບບເສັ້ນໃນແມ່ນ ຮູບແບບຂອງຜູ້ໃຊ້ທີ່ ໃຊ້ໂດຍຜູ້ອ່ານເອງ. ຖ້າທ່ານມີບັນຫາໃນການຮັບເອົາການປ່ຽນແປງຂອງທ່ານທີ່ຈະນໍາໃຊ້, ທ່ານສາມາດລອງຕັ້ງແບບແບບອິນເຕີເນັດຢູ່ໃນອົງປະກອບ. ຖ້າທ່ານຍັງບໍ່ສະແດງຮູບແບບໂດຍໃຊ້ແບບ Inline, ທ່ານຮູ້ວ່າມີສິ່ງອື່ນອີກ.
ຄໍເຕົ້າໄຂ່ໃນເສັ້ນແມ່ນງ່າຍແລະໄວທີ່ຈະເພີ່ມແລະທ່ານບໍ່ຈໍາເປັນຕ້ອງກັງວົນກ່ຽວກັບການຂຽນຕົວເລືອກ CSS ເຫມາະສົມເພາະວ່າທ່ານກໍາລັງເພີ່ມຄໍເຕົ້າໄຂ່ທີ່ໂດຍກົງກັບອົງປະກອບທີ່ທ່ານຕ້ອງການປ່ຽນແປງ (ອົງປະກອບທີ່ແທນທີ່ຈະເລືອກເອົາຕົວເລືອກທີ່ທ່ານຈະຂຽນໃນເອກະສານສະໄຕພາຍນອກ ) ທ່ານບໍ່ຈໍາເປັນຕ້ອງສ້າງເອກະສານໃຫມ່ທັງຫມົດ (ເຊັ່ນດຽວກັນກັບແຜ່ນຮູບແບບພາຍນອກ) ຫຼືແກ້ໄຂເອກະສານໃຫມ່ຢູ່ຫົວຂອງເອກະສານຂອງທ່ານ (ເຊັ່ນດຽວກັບແຜ່ນແບບພາຍໃນ). ທ່ານພຽງແຕ່ເພີ່ມຄຸນລັກສະນະແບບທີ່ຖືກຕ້ອງໃນເກືອບທຸກໆເອກະສານ HTML. ເຫຼົ່ານີ້ແມ່ນເຫດຜົນທັງຫມົດທີ່ວ່າທ່ານອາດຈະຖືກນໍາໃຊ້ໃນຮູບແບບອິນເຕີເນັດ, ແຕ່ທ່ານຍັງຕ້ອງຮູ້ເຖິງຄວາມເສຍຫາຍທີ່ສໍາຄັນຫຼາຍຕໍ່ວິທີການນີ້.
ຂໍ້ເສຍຂອງແບບອິນລັນ
ເນື່ອງຈາກວ່າຮູບແບບຂອງເສັ້ນໃນພວກເຂົາແມ່ນສະເພາະທີ່ສຸດໃນ cascade, ພວກເຂົາສາມາດຂັບເຄື່ອນສິ່ງທີ່ທ່ານບໍ່ໄດ້ຕັ້ງໃຈ. ພວກເຂົາຍັງປະຕິເສດຫນຶ່ງໃນລັກສະນະທີ່ມີປະສິດທິພາບຫລາຍທີ່ສຸດຂອງ CSS - ຄວາມສາມາດໃນການຫລີ້ນຈໍານວນຫລາຍແລະຫລາຍຫນ້າເວັບຈາກແຟ້ມເອກະສານ CSS ກາງເພື່ອເຮັດໃຫ້ການປັບປຸງໃນອະນາຄົດແລະການປ່ຽນແປງແບບງ່າຍໆງ່າຍກວ່າໃນການຄຸ້ມຄອງ.
ຖ້າທ່ານຕ້ອງການນໍາໃຊ້ຮູບແບບໃນຮູບແບບພາຍໃນ, ເອກະສານຂອງທ່ານຈະໄວຂຶ້ນແລະຍາກທີ່ຈະຮັກສາ. ນີ້ແມ່ນຍ້ອນວ່າຄໍເຕົ້າໄຂ່ໃນເສັ້ນຕ້ອງຖືກນໍາໃຊ້ກັບທຸກໆອົງປະກອບທີ່ທ່ານຕ້ອງການ. ດັ່ງນັ້ນ, ຖ້າທ່ານຕ້ອງການໃຫ້ວັກທັງຫມົດຂອງທ່ານທີ່ມີ ຄອບຄົວຕົວອັກສອນ "Arial", ທ່ານຕ້ອງເພີ່ມແບບເສັ້ນໃນແຕ່ລະ
ໃນເອກະສານຂອງທ່ານ. ນີ້ເພີ່ມການເຮັດວຽກການບໍາລຸງຮັກສາສໍາລັບຜູ້ອອກແບບແລະເວລາດາວໂຫລດສໍາລັບຜູ້ອ່ານນັບຕັ້ງແຕ່ທ່ານຈໍາເປັນຕ້ອງມີການປ່ຽນແປງນີ້ໃນທຸກໆຫນ້າໃນເວັບໄຊທ໌ຂອງທ່ານເພື່ອປ່ຽນແປງ font family. ອີກທາງຫນຶ່ງ, ຖ້າທ່ານໃຊ້ຄໍເຕົ້າໄຂ່ທີ່ແຍກຕ່າງຫາກ, ທ່ານອາດຈະສາມາດປ່ຽນມັນຢູ່ໃນຈຸດດຽວແລະມີທຸກໆຫນ້າທີ່ໄດ້ຮັບການປັບປຸງ.
ຄວາມຈິງແລ້ວ, ນີ້ແມ່ນຂັ້ນຕອນທີ່ຖອຍຫລັງໃນການອອກແບບເວັບໄຊຕ໌ - ກັບຄືນວັນຂອງແທໍກ !
ອີກທາງເລືອກຫນຶ່ງທີ່ມີລັກສະນະພາຍໃນແມ່ນວ່າມັນເປັນໄປບໍ່ໄດ້ທີ່ຈະສ້າງແບບຟອມແບບຍ່ອຍແລະຊັ້ນກັບພວກເຂົາ. ສໍາລັບຕົວຢ່າງ, ມີຮູບແບບ ພາຍນອກ , ທ່ານສາມາດສະແດງຮູບແບບການເຂົ້າເບິ່ງ, ຍົກເລີກ, ການເຄື່ອນໄຫວແລະ ການເຊື່ອມໂຍງ ຂອງແທັກມໍນິໂຄ, ແຕ່ດ້ວຍແບບອິນເຕີລ໌, ທັງຫມົດທີ່ທ່ານສາມາດແບບນັ້ນແມ່ນຕົວເຊື່ອມຕໍ່ຕົວມັນເອງ, ທີ່ຢູ່
ໃນທີ່ສຸດ, ພວກເຮົາ ແນະນໍາໃຫ້ ບໍ່ ນໍາໃຊ້ຮູບແບບໃນຮູບແບບອິນເຕີເນັດ ສໍາລັບຫນ້າເວັບຂອງທ່ານເພາະວ່າມັນກໍ່ເຮັດໃຫ້ບັນຫາແລະເຮັດໃຫ້ຫນ້າເວັບເຮັດວຽກຫຼາຍຂຶ້ນ. ເວລາດຽວທີ່ພວກເຮົາໃຊ້ພວກມັນແມ່ນເມື່ອພວກເຮົາຕ້ອງການກວດເບິ່ງແບບຢ່າງໃນລະຫວ່າງການພັດທະນາ. ເມື່ອພວກເຮົາໄດ້ຊອກຫາມັນສໍາລັບອົງປະກອບຫນຶ່ງນັ້ນ, ພວກເຮົາກໍ່ຍ້າຍໄປທີ່ແຜ່ນສະໄຕແບບຕ່າງປະເທດຂອງພວກເຮົາ.
ບົດເລື່ອງໂດຍ Jennifer Krynin. ແກ້ໄຂໂດຍ Jeremy Girard.