თეგი wbr
თეგი wbr მიუთითებს იმ ადგილს, სადაც ბრაუზერს
შეუძლია გაუკეთოს ტექსტის გადატანა საჭიროების შემთხვევაში
(თუ ტექსტი არ ეტევა ელემენტის სიგანეში).
ასეთ გადატანებს რბილებს უწოდებენ.
დამხურავი თეგის საჭიროებას არ იწვევს.
ტექსტის თეგი wbr-ის მეშვეობით გადატანისას
გადატანის სიმბოლო "-" არ ემატება. თუ
ის თქვენ გჭირდებათ - გამოიყენეთ რბილი
გადატანის სიმბოლო ­ (მძიმით
ბოლოს აუცილებელია, ეს შეცდომა არ არის).
რბილი გადატანა ­ მიუთითებს
ბრაუზერს იმ ადგილს, სადაც მას შეუძლია გაუკეთოს ტექსტის გადატანა
(საჭიროების შემთხვევაში), დაუსვამდეს
ამ შემთხვევაში გადატანის სიმბოლო "-".
რბილი გადატანები ­ არ
იმუშავებს, თუ CSS-თვისი hyphens
დაყენებულია მნიშვნელობაზე none (ხოლო გადატანები
wbr იმუშავებს).
მაგალითი . ტექსტი გადატანების გარეშე
შევხედოთ ტექსტის ნიმუშს, რომელშიც არის გრძელი სიტყვები, რომლებიც გამოდიან ბლოკის ფარგლებს გარეთ. ბლოკს დავუყენებთ მცირე სიგანეს ისე, რომ გრძელი სიტყვა მასში არ ჩაეტიოს:
<div id="elem">
this is supersupersuperlong text
</div>
#elem {
width: 200px;
border: 1px solid black;
}
:
მაგალითი . თეგი wbr
აქ კი, დავუმატოთ თეგი wbr
იმ ადგილებში, სადაც ჩვენ ვრეკომენდაციას ვუწევთ ბრაუზერს გაუკეთოს
ტექსტის გადატანა საჭიროების შემთხვევაში (ყურადღება
მიაქციეთ იმას, რომ ბრაუზერი გადატანებს
გაუკეთებს არა ყველგან, სადაც ჩვენ მივუთითეთ):
<div id="elem">
this is super<wbr>super<wbr>super<wbr>long text
</div>
#elem {
width: 200px;
border: 1px solid black;
}
:
მაგალითი . სიმბოლო ­
შევეცადოთ თეგი wbr-ის
ნაცვლად დავსვათ სიმბოლო ­. გადატანის
ადგილებში გამოჩნდება დეფისები:
<div id="elem">
this is supersupersuperlong text
</div>
#elem {
width: 200px;
border: 1px solid black;
}
:
იხილეთ აგრეთვე
-
თეგი
br,
,
რომელიც ტექსტს ახალ ხაზზე გადააქვს -
CSS-თვისი
hyphens,
რომელიც ადგენს ტექსტის ნამდვილ გადატანებს -
CSS-თვისები
word-breakდაoverflow-wrap,
რომლებიც გრძელი სიტყვის ასოების გადატანის საშუალებას იძლევა -
CSS-თვისი
overflow,
რომელიც ბლოკის ფარგლებს გარეთ გამოსულ ნაწილებს ამოჭრის