ტეგები, რომლებიც განსაზღვრავენ აბზაცს, სივრცეს, HTML ბლოკს და აბზაცს
განვიხილოთ დეტალურად HTML ბლოკები და აბზაცებიროგორც ვებ გვერდის ელემენტები.
- HTML პარაგრაფიტეგებით განსაზღვრული.
- HTML აბზაცებიჩვეულებრივ შეიცავს ტექსტს, ფორმატირების ტეგებს, სურათებს.
- HTML პარაგრაფიარ შეიძლება შეიცავდეს ბლოკის ელემენტებს, როგორიცაა სათაურები
- , ბლოკი
და სხვა აბზაცები. - HTML ბლოკიტეგებით განსაზღვრული .
- HTML ბლოკიშეიძლება შეიცავდეს ვებ გვერდის ნებისმიერ ელემენტს, ნებისმიერი რაოდენობით.
- HTML ბლოკებიშესანიშნავია ვებ გვერდებისათვის და ადვილია მანიპულირება.
განვიხილოთ ქვემოთ მოყვანილი კოდი:
შედეგი:
ჩვენ შეგვიძლია ამის დანახვა HTML აბზაცებიშეყვანილია ვერტიკალურად - ეს არის ტეგების თავისებურება. HTML ბლოკები
ტეგები არ შეიძლება შეიცავდეს სხვას ან
წარწერები და, პრინციპში, ერთი და იგივე, მაგრამ W3C კონსორციუმმა გირჩიათ მცირე ასოების გამოყენება. ვ ახალი ვერსია HTML როგორც თანამედროვე XHTML– ში, ტეგების წერისას დიდი ასოების გამოყენება აკრძალულია.
დაბლოკვა
HTML სივრცე სპეციალური სიმბოლოების ცხრილიდან
HTML სივრცესაშუალებას გაძლევთ გაზარდოთ სივრცე სიტყვებსა და სიმბოლოებს შორის.
რაც შეეხება სიტყვებს შორის სივრცეებს, რამდენიც არ უნდა იყოს ისინი Notepad– ში, ანუ წყაროს კოდში, მხოლოდ ერთი იქნება ნაჩვენები ვებ გვერდზე. თუ თქვენ გჭირდებათ მანძილის გაზრდა, გამოიყენეთ სიმბოლო სიმბოლოების ცხრილიდან. თქვენ ჰკითხავთ: რატომ გვჭირდება ჩვეულებრივი პერსონაჟების ეს დაშიფრული მნიშვნელობები? - მე ვუპასუხებ: მათ სჭირდებათ, მაგალითად, ასეთი ფრჩხილების ჩვენება< >... სხვა სიტყვებით რომ ვთქვათ, ტეგების საჩვენებლად, ჩემს რედაქტორში ვწერ: ... ტეგები: როგორც გვახსოვს, გადააქციეთ ტექსტი ერთ სივრცეში (საბეჭდი მანქანა).
HTML აბზაცის ჩვენების გზები
აბზაცის გამომუშავების მაგალითები.
გამარჯობა! მოდით გავაგრძელოთ ვებ - გვერდის პროგრამირების საფუძვლების დათვალიერება. ძნელი წარმოსადგენია რომელიმე მათგანი კოდში აბზაცის გარეშე. დღეს ჩვენ განვიხილავთ, თუ როგორ უნდა დავწეროთ იგი სწორად და რამდენიმე დამატებითი მოქმედების აღწერა ტექსტით.
მაგალითი
ავიღოთ მაგალითი იმისა, თუ როგორ უნდა გავაკეთოთ აბზაცი HTML კოდში.
ერთი ან მეტი წინადადება.
წინაპირობაარის გახსნის და დახურვის ტეგის არსებობა. სხვათა შორის, ყველაფერი შეიძლება გაკეთდეს პირდაპირ ნოუთბუქში, მხოლოდ ამის შემდეგ დაგჭირდებათ ფაილის შენახვა შესაბამის ფორმატში.
ფორმატირება
ხშირად ვამჩნევ, რომ ხალხს აინტერესებს როგორ შეგიძლიათ წითელი ხაზის დადგენა. ეს ძალიან მარტივია კონკრეტული აბზაცისთვის.
ამ პარამეტრების ჩართვისას პირველი სტრიქონი შევა 15 პიქსელი მარცხენა კიდედან. თუ ასეთი ცვლილებები უნდა იქნას გამოყენებული ყველა P ტეგზე, მაშინ CSS ფაილი, რომელიც აკავშირებს საიტის გვერდებს, შეგიძლიათ დაწეროთ ქვემოთ ნაჩვენები კოდი.
პირადად მე, ჩვეულებრივ, წითელ ხაზებს არ ვაკეთებ რვეულის ან სხვა რედაქტორის კოდის რედაქტირებისას.
მე მხოლოდ ტექსტის ბლოკებს შორის ჩავსვამ. ამისათვის თქვენ უნდა დაწეროთ CSS სპეციალური პარამეტრები.
p (ზღვარი-ქვედა: 25px;)
თუ თქვენ იყენებთ ამ კონსტრუქციას, მაშინ თითოეული აბზაცის შემდეგ იქნება 25 პიქსელის ჩანაწერი.
სინამდვილეში, HTML– თან და სხვადასხვა სტილთან მუშაობის უამრავი ვარიანტი არსებობს. მე აღვწერე მხოლოდ რამდენიმე მათგანი, ძალიან რთულია ყველაფრის ერთ სტატიაში გაშუქება.
გსურთ იცოდეთ მეტი? ალბათ, ჩემი წინა პოსტები შემდეგ თემებზე იქნება სასარგებლო:
აქ დავამთავრებ სტატიას და, ვფიქრობ, ახლა არ იქნება რთული აბზაცების გაკეთება HTML- ში და მათი ლამაზად სტილი სპეციალური ტეგების დახმარებით.
გისურვებთ დიდ წარმატებებს პროგრამირების დაუფლებაში. სხვათა შორის, ოდესმე გიფიქრიათ საინფორმაციო არაკომერციულ საიტებზე ფულის გამომუშავებაზე? უბრალოდ ბრწყინვალე ინფორმაცია მიეცა განსაკუთრებულს მისი მკითხველებისთვის.
ონლაინ ბიზნესი და ფინანსები არის ამ ბლოგის მთავარი თემები. თქვენ შეგიძლიათ გაეცნოთ ქსელში არსებულ ინდივიდუალურ პერსპექტივებს ახლავე გამოქვეყნებული მასალებიდან. მე ვაგრძელებ ახალი და, რაც მთავარია, მართლაც სასარგებლო შინაარსის მომზადებას და გამოქვეყნებას. გამოიწერეთ Workip განახლებები თქვენი ელფოსტა... შემდეგ ჯერზე.
- ვებსაიტის შექმნის პროცესში, ჩვენ ბევრი უნდა ვიმუშაოთ ტექსტური ბლოკებით, ან ტექსტური ფრაზებით. ერთხელ, მე დამჭირდა ტექსტური ფრაზის დამატება, ასე რომ ამ ტექსტურ ფრაზამდე იყო რაღაც შეყვანის ტექსტი html პირიდანბლოკი, რომელსაც დაემატა მოცემული ტექსტი.
ასე რომ, პირველი მეთოდი არის ყველაზე ბუნებრივი და მარტივი. ტექსტის წინ ჩასასმელად, დაამატეთ ტექსტამდე html კოდიფართები - თქვენ შეგიძლიათ დაამატოთ html სივრცის კოდი ნებისმიერ html რედაქტორში.
აქ მოცემულია სამუშაო კოდის მაგალითი ტექსტის შეყვანის დასადგენად, სივრცის კოდის გამოყენებით:
Html შეწევის ტექსტი მარცხნივ, გამოიყენეთ სივრცის კოდი
ამ მაგალითში, სანამ ჩვენ შევარჩევთ ტექსტს, სივრცის კოდია -& nbsp; ოთხჯერ დაემატა, შედეგად, ჩვენ ვიღებთ საჭირო კვანძს.
ჩვენ ვიცით, რომ სივრცის კოდს ამუშავებს ნებისმიერი ბრაუზერი. ამიტომ, ტექსტის წინ საჭირო რაოდენობის სივრცეების დამატებით, შეგიძლიათ მიიღოთ ტექსტისთვის საჭირო ჩაღრმავება.
ამ მეთოდის კარგი მხარე ის არის, რომ გარანტირებული იქნება მუშაობა ნებისმიერ ბრაუზერში.
მაგრამ აქვს ეს მეთოდიარის მნიშვნელოვანი ნაკლი. იმისათვის, რომ ტექსტის შეყვანა იყოს საკმარისად დიდი, html კოდში, ტექსტამდე მოგიწევთ დამატება დიდი რიცხვისივრცის პერსონაჟები, რომლებიც შეიძლება არ გამოიყურებოდეს ლამაზად, რთულად და არა პროფესიონალურად.
ამ პრობლემის გადაჭრის ერთ -ერთი ვარიანტია შემდეგი გზამითითებული ჩაღრმავება.
HTML ტექსტის შეყვანა, მეთოდი მეორე - ეს მეთოდი ემყარება ბლოკნოტის ტეგის თვისებებს. ეს ტეგი ადგენს დაახლოებით 40 პიქსელის შეწევას მარცხნივ და მარჯვნივ, მასში განთავსებული ტექსტისთვის. გარდა ამისა, ბალიში დაყენებულია ზედა და ქვედა ნაწილში. Html მაგალითიამ მეთოდის გამოყენების კოდი მოცემულია ქვემოთ:
მარცხნივ გამოიყენეთ ტეგი ბლოკნოტი
როგორც ხედავთ, ტექსტის შეყვანის დაყენების ეს მეთოდი ძალიან ადვილი გამოსაყენებელია, მაგრამ ამ მეთოდს ასევე აქვს მნიშვნელოვანი ნაკლი. ჩაღრმავება, რომელსაც წარწერა ადგენს ბლოკნოტი,არის ფიქსირებული და ყოველთვის ტოლი იგივე მნიშვნელობისა - 40 პიქსელი.
სიტუაციის გამოსასწორებლად და დამატებისას html შეყვანადა ამისთვის ტექსტიშევძლებთ ნებისმიერი მნიშვნელობის დაყენებას, ჩვენ გამოვიყენებთ მესამე მეთოდს.
HTML ტექსტის შეყვანა, მეთოდი სამი.
აქ ჩვენ გამოვიყენებთ CSS კასკადური სტილის ცხრილების ტექსტის შეყვანის თვისებას.
თუ ჩვენ გავხსნით CSS მითითებას, გვერდზე ტექსტის შეყვანის თვისებების აღწერით, ჩვენ დავინახავთ, რომ ტექსტის შეყვანის საშუალებით ჩვენ შეგვიძლია დავაყენოთ პირველი სტრიქონის ან პირველი აბზაცის შეყვანის ოდენობა ტექსტის ბლოკი.
ჩვენ განვიხილავთ მაგალითს მოკლე ტექსტური ბლოკით, ამიტომ ტექსტის შეყვანის თვისებები კარგია ჩვენი შემთხვევისთვის.
ქვემოთ მოცემულია html კოდი, რომელიც ათავსებს ტექსტს ტექსტის შეყვანის გამოყენებით. მაგალითიდან ხედავთ, რომ სხვადასხვა არგუმენტის მნიშვნელობების დაყენებით ტექსტის შეყვანისთვის, ჩვენ შეგვიძლია შევცვალოთ ტექსტის შეყვანის რაოდენობა:
Htmlშეყვანატექსტი CSS სტილი მუშაობს - ტექსტი-ჩანაწერი
ჩემი აზრით, ტექსტის შეღწევის დადგენის ეს მეთოდი არის ყველაზე ოპტიმალური, მაგრამ, მიუხედავად ამისა, განიხილეთ შეღწევის სხვა გზა სურათების გამოყენებით.
HTML ტექსტის შეყვანა, მეოთხე მეთოდი - აქ ჩვენ გამოვიყენებთ გამოსახულებას შეწევის დასადგენად.
როგორც სამუშაო მაგალითი, მოდით შევხედოთ html კოდს, რომელიც აჩვენებს როგორ მუშაობს ეს მეთოდი:
მარცხნივ, გამოიყენეთ სურათი
მოცემული მაგალითიდან ნათლად ჩანს, რომ სურათის სიგანის შეცვლით ჩვენ შეგვიძლია შევცვალოთ ტექსტის პოზიცია, ანუ დავაყენოთ ტექსტისთვის საჭირო ჩაღრმავება.
როგორც სურათი, შეგიძლიათ გამოიყენოთ სურათი, რომლის სიგანე და სიმაღლე უდრის ერთ პიქსელს. ისე, რომ სურათი, რომელსაც ჩვენ ვიყენებთ, არ ჩანს გვერდზე, დააყენეთ ფერი ზუსტად იგივე, რაც საიტის გვერდის ფონი.
ჩემი აზრით, ტექსტის აბზაცების დადგენის ზემოთ მოყვანილი მეთოდები სავსებით საკმარისია იმისათვის, რომ ორგანიზება გაუწიოთ ნებისმიერ სიტუაციაში, თქვენი საიტების გვერდზე შინაარსის დამატებისას.
ნებისმიერ ტექსტს აქვს თავისი უნიკალური სტრუქტურა: წიგნები იყოფა ნაწილებად, ნაწილებად და თავებად, გაზეთებსა და ჟურნალებს აქვთ ცალკეული სათაურები და ქვესათაურები, რომლებიც, თავის მხრივ, მოიცავს ტექსტის ფრაგმენტებს, რომლებსაც ასევე აქვთ საკუთარი სტრუქტურა: აბზაცები, აბზაცები და ა.
ვებ გვერდებზე განთავსებული ტექსტი არ არის გამონაკლისი; მას ასევე უნდა ჰქონდეს ლოგიკური სტრუქტურა, რომელიც გასაგებია ყველა მომხმარებლისთვის. ყოველივე ამის შემდეგ, ბევრი რამ არის დამოკიდებული იმაზე, თუ რამდენად მოსახერხებელი და მარტივი იქნება გვერდის ტექსტი აღქმული: უპირველეს ყოვლისა, როგორი შთაბეჭდილება ექნება ვიზიტორს თქვენს საიტზე.
ტექსტის სტრუქტურული ერთეულების შესაქმნელად, როგორიცაა აბზაცები, HTML დოკუმენტები იყენებენ ტეგს
, რომელიც გამოყოფს ტექსტურ პასაჟებს ვერტიკალური ჩაღრმავებით (ცარიელი ხაზი ემატება აბზაცის წინ და შემდეგ).
შენიშვნა: სტანდარტულად, აბზაცებს შორის მანძილი არის 1em (em არის ერთეულის ზომა ტოლია შრიფტის სიმაღლეზე), ანუ აბზაცებს შორის მანძილი პირდაპირ დამოკიდებულია შრიფტის ზომაზე.
აბზაცებს შორის აბზაცების შესაცვლელად შრიფტის ზომის შეცვლის გარეშე, შეგიძლიათ გამოიყენოთ CSS თვისებაზღვარი
არ დაივიწყოთ ტეგის დასასრული
ბრაუზერების უმეტესობა სწორად გამოაქვეყნებს HTML დოკუმენტს, თუნდაც დაივიწყოთ ბოლო ტეგი.
პარაგრაფი
კიდევ ერთი აბზაცი
ეს კოდი იმუშავებს ბრაუზერების უმეტესობაში, მაგრამ ნუ დაეყრდნობით მას. დავიწყებული დასასრულის ტეგს შეუძლია გამოიწვიოს მოულოდნელი შედეგები ან შეცდომები.
წითელი ხაზი
რა არის წითელი ხაზი? განმარტების თანახმად, ეს არის აბზაცის გახსნის ხაზი, რომელიც ადრე წითლად იყო მონიშნული (შესაბამისად სათაურიც). ტიპოგრაფიის გამოგონებამდე წიგნები იწერებოდა ხელით - ტექსტის თავი ან ნაწილი, პირველი სიტყვა ან ასო დაწერილი იყო წითელი საღებავით. ასე გაჩნდა კონცეფცია "წერა წითელი ხაზიდან" - ეს ნიშნავს ახალი აზრის, თავის ან ნაწილის დასაწყისს.
თუმცა, ვებ გვერდების შექმნისას, წითელი ხაზის დიზაინი იშვიათად გამოიყენება, იმისდა მიუხედავად, რომ ის გაძლევთ ტექსტის ვიზუალურად აღქმის ბევრად უფრო მოხერხებულობას, რაც საკმაოდ მნიშვნელოვანია ტრადიციული მკითხველისთვის - ყველას არ უხდება ელექტრონული კითხვის საშუალება ტექსტის ვერსია.
თქვენს აბზაცებზე წითელი ხაზის დასამატებლად, თქვენ უნდა გამოიყენოთ ტექსტის შეყვანის CSS თვისება, რომელიც საშუალებას გაძლევთ პირველი წინადადების დახაზვა:
სცადე "
ზემოთ მოყვანილ მაგალითში, გვერდის თითოეული აბზაცის პირველი სტრიქონი დაიწყება 25 პიქსელით. ქვემოთ მოყვანილი მაგალითი გვიჩვენებს, თუ როგორ შეგიძლიათ დააყენოთ წითელი ხაზი მხოლოდ კონკრეტული აბზაცისთვის გვერდზე.
როგორც ნებისმიერ რეალურ ხელოვნებაში, არ არსებობს წვრილმანები კარგ ტექსტებში, რომელთაგან ზოგი წითელ ხაზს მოიცავს, მიაჩნიათ, რომ მისი გამოყენება არც ისე მნიშვნელოვანია. ამასთან, უნდა გვესმოდეს, რომ ნებისმიერი მძიმით არის ესთეტიკური და სემანტიკური დატვირთვა და არა მხოლოდ გრამატიკის წესების ხარკია - ეს ასევე ეხება ფორმატირებას.
სცადე "შენიშვნა: არ არის აუცილებელი შევსების დაყენება 25 პიქსელზე, თქვენ შეგიძლიათ აირჩიოთ ოპტიმალური ზომათავად ჩაღრმავება, ასევე ტექსტის შეყვანის თვისების საშუალებით შესაძლებელია ხაზის ამოკვეთა დანარჩენი ტექსტის ზემოთ, ამისათვის თქვენ უნდა მიუთითოთ თვისების უარყოფითი მნიშვნელობა (მაგალითად: -30 პიქსელი).
ამოცანა
მონიშნეთ თითოეული აბზაცის პირველი სტრიქონი.
გადაწყვეტა
როდესაც თქვენ გჭირდებათ აბზაცის დაყენება, რომელსაც ასევე წითელი ხაზი ეწოდება, უმჯობესია გამოიყენოთ ტექსტის შეყვანის სტილის თვისება. მისი მნიშვნელობა განსაზღვრავს რამდენად გადაიტანოს პირველი სტრიქონის ტექსტი მარჯვნივ საწყისი პოზიცია... ამ შემთხვევაში, ტექსტის ბლოკის სიგანე არ იცვლება და თავდაპირველად რჩება მითითებული. ჩაღრმავების რაოდენობა შეიძლება დაზუსტდეს პიქსელებში, პროცენტულ ან სხვა ხელმისაწვდომ ერთეულებში (მაგალითი 1).
მაგალითი 1. პირველი სტრიქონის დახაზვა
HTML5 CSS 2.1 IE Cr Op Sa Fx
ბაბილონური პანდემონია, ბიბლიური ტრადიციის თანახმად, არის მეფე ნიმროდის წარუმატებელი მცდელობა ბაბილონში სვეტის ასაშენებლად ცამდე. ღმერთმა, გაბრაზებულმა ადამიანებმა მათი უგუნური სურვილის გამო, გადაწყვიტა დაესაჯა მშენებლები: მან აურია მათი ენა ისე, რომ მათ შეწყვიტეს გაგება ერთმანეთს, იძულებულნი გახდნენ შეეწყვიტათ მშენებლობა და ნელ -ნელა მიმოფანტეს მთელს მსოფლიოში. მაშასადამე, როგორც ძველებმა განმარტეს, ენათა სხვაობა წარმოიშვა.
ჩვეულებრივი კონცეფციით, ბაბილონური პანდემიონი ნიშნავს არეულობას, დაბნეულობას ხალხის დიდ ჯგუფთან.
ამ მაგალითის შედეგი ნაჩვენებია ნახ. 1
