Html ზედნაშენი. Html - ასე ხდება ტექსტის გენერირება css ზედა რეგისტრიდან. ნახეს დიდი მწერლები

CSS საშუალებას გაძლევთ დააკონფიგურიროთ ტექსტი, როგორიცაა წარმოდგენები დამატებითი HMTL ენის გამოყენებით. დღეს ჩვენ ვუყურებთ „ტექსტის ტრანსფორმაციის“ ძალას, რაც შესაძლებელს ხდის შრიფტის რეესტრის შეცვლას. ეს ვარიანტი მხარს უჭერს ყველას მიმდინარე ბრაუზერებიდა შედის CSS-ის ყველა ვერსიის სპეციფიკაციაში.

აღიარება

"ტექსტის ტრანსფორმაციის" სიმძლავრემ შეიძლება მიიღოს სამი ძირითადი მნიშვნელობა და ორი დამატებითი. მაგალითად, შეგიძლიათ დაამატოთ დიდი ასოები ყველა ტექსტს, რომელსაც ხედავთ. ან შეგიძლიათ მისცეთ ბრძანება წინა ხელისუფლების მფარველს, მაგრამ ყველა სიმბოლო გახდება პატარა. თქვენ ალბათ შეგიძლიათ დააფასოთ ნებისმიერი სხვა მეთოდი, რომელიც თქვენთვის შესაფერისია. მაგალითად, შექმნილი სტილების დახმარებით. ან შეგიძლიათ შექმნათ

მოკლე ფაილი ყველა ავტორიტეტის აღწერით. რა სახის ვიკორისტული გზა არსებობს თქვენთვის? "ტექსტის ტრანსფორმაცია" შეიძლება შეიცავდეს შემდეგ მნიშვნელობებს:

  • დიდი ასო. გახადე ყველა სიმბოლო, რომელსაც ხედავ. CSS-ში დიდი ასოები ხშირად შეკუმშულია, რადგან ეს მნიშვნელობა ხელს უწყობს ტექსტთან დაკავშირებული სირთულეების სიმდიდრეს.
  • მცირე ასო. ძალა ენიჭება დიდი ბრძანების მთლიანობას.
  • კაპიტალიზაცია. ცვლის პირველი ასოს რეესტრს ზედა. რეშტას სიმბოლო არ შეიცვლება.
  • არცერთი. საშუალებას აძლევს გამოხატოს ყველა მნიშვნელობის მნიშვნელობა (აუცილებელია ძალაუფლების მინიჭებისთვის). როგორც წესი, ეს მნიშვნელობა დადგენილია წესების მიღმა.
  • მემკვიდრეობით. აქვეითებს სამშობლოს ელემენტის მთელ ძალას. გთხოვთ გაითვალისწინოთ, რომ IE არ უჭერს მხარს ამ ძალას.

zastosuvannya

Wikoristanny CSSდიდი ასოები (ან მსგავსი ეფექტები) დაყენებულია ერთი მარტივი ბრძანების გამოყენებით. ამიტომ, არ არის საჭირო მთელი ტექსტის შეცვლა ან გადაწერა. თუ თქვენ საუბრობთ ცალმხრივ საიტზე, მაშინ ეს ძალა შეიძლება არ იყოს საჭირო. თუ თქვენ გაქვთ დიდი პორტალი თქვენი კონტროლის ქვეშ და გჭირდებათ სიმღერების ფრაგმენტებში ასოების რეესტრის კორექტირება, მაშინ "ტექსტის ტრანსფორმაცია" ხდება ერთადერთი ეფექტური მეთოდი. მაგალითად, თქვენ უნდა შეასწოროთ შრიფტი სათაურ ტეგებში „h2“. ამისათვის თქვენ უნდა დაამატოთ ჩანაწერი: „h2 (ტექსტის ტრანსფორმაცია: დიდი;)“, და შემდეგ სხვა დონის ყველა სათაური ჩაიწერება კაპიტალიზებით.

მახასიათებლები

მოთამაშეებმა შეიძლება გააცნობიერონ, რომ ტექსტის ხელით დამუშავებას და შრიფტის შეცვლას "ტექსტის ტრანსფორმაციის" დამატებითი ძალის გამოყენებით არანაირი მნიშვნელობა არ აქვს. ეს ასე არ არის. თუ თქვენ ხელით შეცვლით დიდ ასოებს (მთავრული ასოები), მაშინ როდესაც თქვენ დააკოპირებთ ინფორმაციას თქვენი საიტიდან, სიმბოლოები დაიკარგება ცვლილებების გარეშე. თუ იყენებთ CSS ენას, მაშინ ყველაფერი სხვაგვარად გამოიყურება. „ტექსტის ტრანსფორმაციის“ ძალა შრიფტს მხოლოდ ვიზუალურად ცვლის ჟურნალისტებისთვის. თუმცა, მათი ეფექტურობით, სიმბოლოები უცვლელი ხდება. ეს აშკარაა ამ ძალაუფლების მთელი მნიშვნელობიდან. დაკოპირებული ინფორმაცია (ტექსტი) იქნება ორიგინალური რეესტრი, რომელიც შეყვანილია გამომავალი კოდიმოთხრობები. სწორედ აქ არის განსხვავება ხელით დამუშავებასა და შემთხვევით CSS ბრძანებებს შორის.

არ აქვს მნიშვნელობა რა გზით გსურთ მისი ხაზგასმა - ქვედა თუ ზედა რეგისტრი, ჭუჭყიანი, არ დაივიწყოთ აღიარება. მაგალითად, თუ თქვენ შეცვლით თქვენს საჭიროებებს მხოლოდ დეკორატიული მეთოდით, შეგიძლიათ მშვიდად გამოიყენოთ "ტექსტის ტრანსფორმაციის" ძალა. კარგად, თუ იცით, რომ თქვენი კორესპონდენტები სამახსოვრო დააკოპირებენ თქვენს მიერ შეყვანილ ინფორმაციას, უმჯობესია ხელით შეცვალოთ ყველა ტექსტის რეესტრი. ზოგიერთი მკითხველი ვერ ამჩნევს შრიფტის მსგავს ცვლილებებს. ეს განსაკუთრებით მნიშვნელოვანია, როდესაც საქმე ეხება მნიშვნელოვან დოკუმენტებსა და მსგავს ინფორმაციას.

რიგ გაკვეთილებზე ვცადეთ ტექსტის ფორმატირება დამატებითი CSS-ის გამოყენებით და ამჯერად უნდა შევცვალოთ ტექსტის რეესტრი. ამ მხრივ, კასკადური სტილის ფურცლები გვიხსნის კიდევ უფრო ფართო შესაძლებლობებს და უფრო ზუსტად, შეგვიძლია:

  • დიდი მწერლების მთელი ტექსტის წარმოდგენა;
  • იხილეთ მთელი ტექსტი მცირე ასოებით;
  • იმუშავეთ ისე, რომ ყოველი სიტყვის პირველი ასო იწყება დიდი მწერლებით.

”ყველაფერი ნამდვილად კარგია, მაგრამ როდის შეიძლება დამჭირდეს?” - გთხოვოთ. ჩვენ ვიცით ეს სიტუაცია, თუ თქვენ გჭირდებათ მენიუს ყველა ელემენტის დიდი ასოებით ჩვენება. ვისთვისაც არ არის სავალდებულო მათი აკრეფა, ჩართეთ CapsLock ღილაკი ან ხანგრძლივად დააჭირეთ Shift ღილაკს. თქვენ მოგიწევთ ეკრანის სიის ყველა ელემენტის დაყენება დიდი ასოებით CSS ფაილში სპეციალური წესის შექმნით. და ეს მხოლოდ ერთია იმ მრავალი შესაძლო სიტუაციიდან.

დენის ტექსტის ტრანსფორმაცია

Keruvati რეგისტრირებული ტექსტი ჩვენ გამოვიყენებთ ტექსტის ტრანსფორმაციის დამატებით ძალას. მას აქვს 4 ძირითადი მნიშვნელობა - დიდი (დიდი ასოები), პატარა (პატარა ასოები), კაპიტალიზაციით (ზედა ასო სიტყვის პირველ ასოში, სხვა მნიშვნელობები არ იცვლება), არცერთი (ფორმატირება არ არის სტაგნირებული). ერთი შეხედვით, შეიძლება მაინც იფიქროთ, რომ ეს ბევრად უფრო რთულია.


გოლოვნე - ნუ ჩავარდებით...

მაგრამ პრაქტიკაში ადვილია ყველაფრის დასრულება, ასე რომ, რაზე გადადიხარ დაუყოვნებლივ? მნიშვნელოვანია სწორი ამომრჩევის არჩევა და ტექსტის ტრანსფორმაციის სიმძლავრის მნიშვნელობებიც კი მცირდება.

ნახეს დიდი მწერლები

უპირველეს ყოვლისა, მე ვთავაზობ ყველა ტექსტს დიდი ასოებით დავადოთ, რისთვისაც ახლა ვქმნით CSS წესი:

ტექსტი (ტექსტის ტრანსფორმაცია: დიდი;)

პრინციპში, არაფერია რთული, ჩვენ უბრალოდ ვიკორიზირებულია დიდი ასოების მნიშვნელობა. როგორც ჩანს, ყველაფერი ინტუიციურად ნათელი გახდა. ასე გამოიყურება ღერძი ცხოვრებაში:


ყველაფერი დიდი ლიტერატურიდან...

პატარა რეგისტრი - დაყენებულია ყველასთვის

დავიწყოთ ყველგან სტაგნაცია მცირე ასოებით, რისთვისაც ახლა ვწერთ:

ტექსტი (ტექსტის ტრანსფორმაცია: პატარა;)

როგორც უკვე მელოდიურად მიხვდით, არსებობს ორი მნიშვნელობა, რომელიც ამ სამყაროში მხოლოდ რამდენიმე ადამიანმა იცის, როგორც ანტონიმები. და ქვემოთ მოცემულ ილუსტრაციაში შეგიძლიათ იხილოთ საგულდაგულოდ შექმნილი სიმძლავრის შედეგი.


ვებ გვერდი ჩართულია პატარა ასოებით

როგორც ჩანს, კანის სიტყვის ასოს დიდი ასოებით ვწერ

ამისათვის საკმარისია სწრაფად გამოვთვალოთ შემდეგი მნიშვნელობები:

ძირითადი ტექსტი (ტექსტის ტრანსფორმაცია: დიდი ასოებით;)

არ ვიცი, რამდენად ხშირად გამოიყენებთ ამ CSS წესს, მაგრამ თქვენ არ გეცოდინებათ ასეთი შესაძლებლობა, განსაკუთრებით ძალიან უჩვეულო ამოცანების შემთხვევაში. შედეგი შეგიძლიათ იხილოთ ქვემოთ მოცემულ სურათზე.


ტექსტი სტაგნაციის შემდეგ დიდი ასოებით

და მოკლედ ვისაუბროთ დარჩენილ მნიშვნელობაზე - არცერთი. როგორც უკვე ვთქვი, თქვენ შეგიძლიათ აღუდგეთ მამის დაცემას. მაგალითად, გასაგებია, რომ ჩვენ გვაქვს ყველა წინა წესი, მაგრამ აბზაცებისთვის უნდა ვთქვათ ისინი, რისთვისაც შემდეგს ვწერთ:

P (ტექსტის ტრანსფორმაცია: არცერთი;)

შემიძლია ვთქვა, რომ თქვენ მიხვდით, რომ არაფერია - ჰკითხეთ თქვენი კვება კომენტარებში. და რატომ მაქვს ყველაფერი? ვიმედოვნებ, რომ ეს გაკვეთილი CSS-ზე თქვენთვის სასარგებლო იქნება. ეს ასეა:

  • ხელახლა გამოაქვეყნეთ ეს სტატია სოციალური ზომები, რათა უფრო მეტმა ადამიანმა უარყო მისგან ქერქი;
  • გამოიწერეთ ჩემი საინფორმაციო ბიულეტენი, რათა არ გამოტოვოთ ბლოგის არც ერთი ყველაზე მაგარი და მაგარი პუბლიკაცია.

ამიტომაც არ გემშვიდობები. გმადლობთ პატივისცემისა და თანამშრომლობისთვის მომავალ პუბლიკაციებში!

Საღამო მშვიდობისა. ვებ გვერდების შექმნისას თქვენ უნდა მიუთითოთ შემდეგი სიტყვები გთხოვთ დამეხმაროთ css-სდიდი ასოებით ან ვიკორისტები მაღალი ხმით. მოდი გავაკვირვოთ, რამდენად მორცხვია.

დიდი და პატარა რეგისტრები დამატებითი css-ის გამოყენებით

დღესდღეობით შეგიძლიათ საჭირო ტექსტის ჩასმა ტეგებში და აღმოფხვრა ვიზუალიზაციის საჭიროება, მაგრამ მოდი ისიც ვიფიქროთ, რამდენის გაკეთება შეგიძლიათ CSS-ის დახმარებით, რადგან ტექნიკა ოდნავ იცვლება.

მაგალითად, თქვენ უნდა ჩაწეროთ ფორმულა H 2 O html დოკუმენტში. სცადე ასე:

  • თავად ფორმულა წერია
  • ის სიტყვები და რიცხვები, რომლებიც უნდა შეიყვანოთ ზედა ან ქვედა ინდექსში, მოთავსებულია span ტეგში, რომელიც გარკვეულწილად უნდა იყოს მითითებული. მაგალითად: სიმბოლოები, რომლებიც უნდა შეიყვანოთ
  • CSS-ში თქვენ უნდა დააყენოთ ეს ელემენტი:

    ზედა ინდექსი (
    ვერტიკალური გასწორება: სუპერ;
    }

ეს ძალა განპირობებულია ტექსტის ვერტიკალური გასწორებით. super-ის ეს მნიშვნელობა ნიშნავს, რომ ტექსტი ნაჩვენებია ზედწერილში. თუმცა, შრიფტის ზომა იგივეა, რაც ორიგინალური ტექსტისა. იმისათვის, რომ ყველაფერი უფრო ლამაზად გამოიყურებოდეს, თქვენ ასევე უნდა დააყენოთ შრიფტის ზომა ოდნავ ნაკლები, რათა აკონტროლოთ შრიფტის ზომა.

ღერძი მხოლოდ ძალაუფლების ღერძია. როგორც ჩანს, ქვედა ინდექსში გამოსაჩენად, თქვენ უნდა დაწეროთ ასე:

ზედა ინდექსი (
Vertical-align: sub;
}

მსგავს HTML ტეგებს შორის განსხვავება ისაა, რომ ეს წესები არ ცვლის შრიფტის ზომას, ასე რომ, თუ ამის გაკეთება დაგჭირდებათ, მოგიწევთ ახალი ზომის დარეგისტრირება სტილის ფურცელში.

აქ არის ყველაფერი, რაც თქვენ უნდა იცოდეთ CSS-ის ზემოწერისა და ხელმოწერის შესახებ. არცერთი დამატებითი შესაძლებლობებიძალა არ იძლევა და არ არის საჭირო სუნი. საჭიროების შემთხვევაში, შეგიძლიათ ამ ტექსტის ფორმატირება სპეციალური გზით, მაგრამ ეს იშვიათად არის საჭირო.

სად შეგიძლიათ დარჩეთ ბედნიერად?

ფორმულების წერისას, სტატიებში შენიშვნებისა და ხატების დამატებისას შეიძლება აირიოს ზედა და დაქვემდებარებული ტექსტი. მაგალითად, ვიკიპედიაში დეტალები და შენიშვნები მოცემულია ყველა დეტალზე. სუნის მატებასთან ერთად, ხედის წინ ჩნდება მცირე ზედაპირული ნიშნები. ეს არ ავნებს მკითხველს და ამავდროულად საშუალებას გაძლევთ წარადგინოთ სტატიები საჭირო ფორმით.

ჯვარედინი ბრაუზერის თავსებადობა და მხარდაჭერილი CSS-ის ყველა ვერსიაში.

HTML ტეგები і - სიტყვასიტყვითი და ზედნაწერი ტექსტი

ვიზნაჩენნია და ვიკორისტანნია

ტეგი ნიშნავს დაქვემდებარებულ ტექსტს. დაქვემდებარებული ტექსტი ნახევრად სიმაღლისაა და ჩანს საბაზისო ხაზის ქვემოთ. დაქვემდებარებული ტექსტი შეიძლება არასწორად იყოს გამოყენებული ქიმიური ფორმულების წერისას, მაგალითად H 2 O.

ტეგი ნიშნავს ზედწერილ ტექსტს. საზედამხედველო ტექსტი ნახევრად სიმაღლისაა და ჩანს საბაზისო ხაზის ზემოთ. საზედამხედველო ტექსტი შეიძლება არასწორად იქნას გამოყენებული ღვინოების დაწერისას, მაგალითად WWW.

ბრაუზერის მხარდაჭერა

ტეგები і მხარდაჭერილია ყველა ძირითადი ბრაუზერის მიერ.

განსხვავებები HTML-სა და XHTML-ს შორის

სტანდარტული ატრიბუტები

ღუმელები DTDმიუთითებს ნებართვების ატრიბუტზე, რომელშიც წერია დოკუმენტი HTML 4.01 / XHTML 1.0 DTD. S = მკაცრი, T = გარდამავალი და F = ჩარჩოს ნაკრები.

ტეგები і მხარს უჭერს შემდეგ სტანდარტულ ატრიბუტებს:

ატრიბუტი მნიშვნელობა აღწერე DTD
კლასი მე კლასი ვარ განსაზღვრავს კლასის სახელს ელემენტისთვის STF
რეჟ rtl
ლტრ
მიუთითებს პირდაპირ ტექსტზე ელემენტის ნაცვლად STF
id ID განსაზღვრავს ელემენტის უნიკალურ იდენტიფიკატორს STF
ენა ენის_კოდი ამის ნაცვლად, მიუთითეთ ელემენტის ფილმის კოდი STF
სტილი style_definition მიუთითეთ ელემენტისთვის სასურველი სტილი STF
სათაური ტექსტი მიუთითებს დამატებით ინფორმაციას ელემენტის შესახებ STF
xml: lang ენის_კოდი მიუთითებს ფილმის კოდს XHTML დოკუმენტებში ელემენტისთვის STF

დამატებითი ინფორმაცია სტანდარტული ატრიბუტების შესახებ.

ატრიბუტები Podiy

ტეგები і მხარს უჭერს შემდეგ ატრიბუტებს:

ატრიბუტი მნიშვნელობა აღწერე DTD
დააწკაპუნეთ სკრიპტი სკრიპტი, რომელიც მუშაობს სამიზნეზე დაწკაპუნებისას STF
ondblccck სკრიპტი სკრიპტი, რომელიც მუშაობს სამიზნეზე ძლიერად დაჭერისას STF
onmousedown სკრიპტი სკრიპტი, რომელიც მუშაობს მაუსის ღილაკზე დაჭერისას STF
onmousemove სკრიპტი სკრიპტი, რომელიც მუშაობს მაუსის მაჩვენებლის გადაადგილებისას STF
onmouseout სკრიპტი სკრიპტი, რომელიც მუშაობს, როდესაც მაუსის კურსორი მოძრაობს ელემენტის საზღვრებს მიღმა STF
მაუსის გადაღმა სკრიპტი სკრიპტი, რომელიც მუშაობს, როდესაც მაუსის მაჩვენებელი მოძრაობს ელემენტზე STF
onmouseup სკრიპტი სკრიპტი, რომელიც მუშაობს მაუსის ღილაკის გათავისუფლებისას STF
onkeydown სკრიპტი სკრიპტი, რომელიც მუშაობს ღილაკის დაჭერისას STF
ღილაკზე დაჭერით სკრიპტი სკრიპტი, რომელიც მუშაობს კლავიშის დაჭერისას და შემდეგ გამოშვების დროს STF
onkeyup სკრიპტი სკრიპტი, რომელიც მუშაობს გასაღების გამოშვებისას STF

დამატებითი ინფორმაცია იმის შესახებ