ການນໍາໃຊ້ຊັບສິນທີ່ມີຂໍ້ຄວາມແລະການເລືອກທີ່ຢູ່ໃກ້ຄຽງ
ການອອກແບບເວັບ ທີ່ດີມັກຈະກ່ຽວກັບຮູບແບບທີ່ດີ. ນັບຕັ້ງແຕ່ເນື້ອໃນຂອງຫນ້າເວັບຫຼາຍສະແດງໃຫ້ເຫັນວ່າເປັນຂໍ້ຄວາມ, ສາມາດສະໄຕຮູບແບບທີ່ເປັນທີ່ຫນ້າສົນໃຈແລະມີປະສິດທິຜົນເປັນທັກສະທີ່ສໍາຄັນທີ່ຈະເປັນຜູ້ອອກແບບເວັບ. ແຕ່ຫນ້າເສຍດາຍ, ພວກເຮົາບໍ່ມີລະດັບການຄວບຄຸມແບບພິມແບບດຽວກັນທີ່ພວກເຮົາພິມຢູ່. ນີ້ຫມາຍຄວາມວ່າພວກເຮົາບໍ່ສາມາດສະຫງວນຂໍ້ຄວາມກ່ຽວກັບເວັບໄຊທ໌ໃນແບບດຽວກັນທີ່ພວກເຮົາສາມາດເຮັດໄດ້ໃນປ້າຍພິມ.
ຮູບແບບວັກຫນຶ່ງທີ່ທ່ານມັກເຫັນຢູ່ໃນພິມ (ແລະພວກເຮົາສາມາດສ້າງໃຫມ່ອອນໄລນ໌) ແມ່ນບ່ອນທີ່ແຖວທໍາອິດຂອງວັກນັ້ນຖືກດັດແປງ ພື້ນທີ່ແທັບ ຫນຶ່ງ. ນີ້ອະນຸຍາດໃຫ້ຜູ້ອ່ານເຂົ້າໃຈວ່າວັກຫນຶ່ງເລີ່ມຕົ້ນແລະອີກຄັ້ງສິ້ນສຸດ.
ທ່ານບໍ່ເຫັນແບບຕານີ້ທີ່ມີຢູ່ຫຼາຍໃນຫນ້າເວັບເພາະວ່າຕົວທ່ອງເວັບໂດຍຕົວຢ່າງສະແດງຫນ້າຈໍທີ່ມີຊ່ອງຫວ່າງພາຍໃຕ້ພວກມັນເປັນວິທີທີ່ຈະສະແດງໃຫ້ເຫັນບ່ອນທີ່ຫນຶ່ງສິ້ນສຸດລົງແລະເລີ່ມຕົ້ນອື່ນແຕ່ຖ້າທ່ານຕ້ອງການແບບຫນ້າທີ່ມີ print- ສະແດງໃຫ້ເຫັນແບບດັ້ງເດີມຂອງຕົວຫນັງສືກ່ຽວກັບວັກ, ທ່ານສາມາດເຮັດໄດ້ດັ່ງນີ້ດ້ວຍຄຸນສົມບັດແບບ ຕົວຫນັງສື .
syntax ສໍາລັບຊັບສິນນີ້ແມ່ນງ່າຍດາຍ. ຕໍ່ໄປນີ້ແມ່ນວິທີທີ່ທ່ານຈະເພີ່ມຂໍ້ຄວາມເຂົ້າຫາວັກທັງຫມົດໃນເອກະສານ.
p {text-indent: 2em }Customizing the Indents
ຫນຶ່ງໃນວິທີທີ່ທ່ານສາມາດລະບຸຂໍ້ຄວາມທີ່ແນ່ນອນເພື່ອເຂົ້າຫາ, ທ່ານສາມາດເພີ່ມຫ້ອງຮຽນໃຫ້ກັບວັກຕ່າງໆທີ່ທ່ານຕ້ອງການຂຽນ, ແຕ່ວ່າທ່ານຕ້ອງແກ້ໄຂທຸກໆວັກເພື່ອເພີ່ມຫ້ອງຮຽນໃຫ້ມັນ. ວ່າບໍ່ມີປະສິດຕິພາບແລະບໍ່ປະຕິບັດຕາມ HTML ການ ປະຕິບັດທີ່ດີທີ່ສຸດ.
ແທນທີ່ຈະ, ທ່ານຄວນພິຈາລະນາໃນເວລາທີ່ທ່ານເຂົ້າໃນວັກ. ທ່ານກ່າວເຖິງຂໍ້ກໍານົດທີ່ກົງຕາມວັກອີກ. ເພື່ອເຮັດສິ່ງນີ້, ທ່ານສາມາດໃຊ້ຕົວເລືອກອ້າຍນ້ອງທີ່ຢູ່ໃກ້ຄຽງ. ມີຕົວເລືອກນີ້, ທ່ານກໍາລັງເລືອກທຸກວັກທີ່ຖືກນໍາຫນ້າໄວ້ກ່ອນໂດຍວັກຫນຶ່ງອີກ.
p + p {text-indent: 2em }ນັບຕັ້ງແຕ່ທ່ານກໍາລັງເລີ້ມເສັ້ນທໍາອິດ, ທ່ານຄວນກວດເບິ່ງໃຫ້ແນ່ໃຈວ່າວັກຂອງທ່ານບໍ່ມີພື້ນທີ່ພິເສດໃດໆລະຫວ່າງພວກມັນ (ເຊິ່ງແມ່ນຕົວເລືອກຂອງຕົວທ່ອງເວັບ). Stylistically, ທ່ານຄວນຈະມີຊ່ອງຫວ່າງລະຫວ່າງວັກ ຫຼືການ ປ້ອນເສັ້ນທໍາອິດ, ແຕ່ບໍ່ແມ່ນທັງສອງ.
p {margin-bottom: 0; padding bottom: 0; } p + p {margin-top: 0 padding-top: 0 }Negatives Indents
ນອກນັ້ນທ່ານຍັງສາມາດນໍາໃຊ້ຄຸນສົມບັດການເຂົ້າເຖິງ ຂໍ້ຄວາມ , ພ້ອມກັບມູນຄ່າທາງລົບ, ເພື່ອເຮັດໃຫ້ການເລີ່ມຕົ້ນຂອງເສັ້ນທາງໄປທາງຊ້າຍ, ກົງກັນຂ້າມກັບສິດທິເຊັ່ນການປ້ອນຂໍ້ມູນປົກກະຕິ. ທ່ານອາດຈະເຮັດແນວນີ້ຖ້າສາຍເລີ່ມຕົ້ນດ້ວຍເຄື່ອງຫມາຍຄໍາເວົ້າເພື່ອວ່າຕົວເລກຄໍາເວົ້າຈະປາກົດຢູ່ໃນຂອບຂອບເລັກນ້ອຍຢູ່ເບື້ອງຂວາຂອງວັກແລະຕົວອັກສອນຂອງຕົວເອງກໍ່ຍັງຄົງເປັນການປັບຕົວຊ້າຍທີ່ດີ.
ຕົວຢ່າງ, ທ່ານເວົ້າວ່າທ່ານມີວັກຫນຶ່ງທີ່ເປັນລູກຫລານຂອງຕົວຫນັງສືແລະທ່ານຕ້ອງການໃຫ້ມັນເຂົ້າໄປໃນທາງລົບ. ທ່ານສາມາດຂຽນ CSS ນີ້ໄດ້:
blockquote p {text-indent: -5em }ນີ້ຈະໃຫ້ການເລີ່ມຕົ້ນຂອງວັກ, ເຊິ່ງສົມມຸດວ່າປະກອບມີລັກສະນະ quote quote ເປີດ, ຈະຍ້າຍເລັກນ້ອຍໄປທາງຊ້າຍເພື່ອສ້າງການຂີດຫມາຍຫ້ອຍ.
ກ່ຽວກັບຂອບແລະພັບ
ມັກໃນການອອກແບບເວັບໄຊຕ໌, ທ່ານໃຊ້ ຂອບຂອບຫລືຄ່າ padding ເພື່ອຍ້າຍອົງປະກອບແລະສ້າງພື້ນທີ່ສີຂາວ. ຢ່າງໃດກໍຕາມ, ຄຸນສົມບັດເຫຼົ່ານັ້ນຈະບໍ່ເຮັດວຽກເພື່ອບັນລຸຜົນກະທົບຕໍ່ວັກ. ຖ້າທ່ານນໍາໃຊ້ຄ່າເຫຼົ່ານີ້ໄປຫາວັກ, ຂໍ້ຄວາມທັງຫມົດຂອງວັກນັ້ນ, ລວມທັງເສັ້ນທຸກ, ຈະຖືກແຍກເປັນເສັ້ນທໍາອິດ.