jQuery wrap() Yöntemi

wrap() Yöntemi;

wrap() yöntemi Seçilen elementin etrafını belirtilen HTML elementiyle sarar.

Örnek

$("a").click(function(){
  $("p").wrap("<div></div>");
});

Codepen Ön izleme

Kullanım şekilleri;

.wrap( wrappingElement )

.wrap( function )

CSS3 word-wrap

word-wrap :

Çerçeveye sığmayan yazıları kesip alt satıra atmak için kullanılır.

Örnek

p {
  width: 300px;
  border :1px solid red;
  word-wrap: break-word;
}

Codepen Ön izleme

 

Css Sözdizimi

Değer Açıklama
normal Hiç bir değişiklik yapmadan normal bir şekilde kullanımı sağlar.
break-word Break word ise normal kullanımın tam aksine divimizin sınırlarından dışarıya çıkmasını engeller.
İnital
İnherit

Tarayıcı Desteği

4.0 3.5 5.5 3.1 10.5

CSS flex-wrap

flex-wrap :

İki ve daha fazla satırdan oluşan esnek kutuların nasıl bir davranış sergileyeceğini belirlemek için kullanılır.

Not: elementin flex özelliği yoksa ,flex-wrap etkili olmaz.

Örnek

.flex {
    width: 150px;
    height: 150px;
    display: -webkit-flex; /* Safari */
    -webkit-flex-wrap: wrap; /* Safari 6.1+ */
    display: flex;
    flex-wrap: wrap;
    background: red;
    color: white;
}

Codepen Ön izleme

 

Css Sözdizimi

Değer Açıklama
nowrap Tek satırda flex ler soldan sağa sıralaması için kullanılır.
wrap İki veya daha fazla satırda flex ler soldan sağa sıralaması için kullanılır.
Wrap-reverse iki veya daha fazla satırda esnek kutular sağdan sola sıralaması için kullanılır.
İnital
İnherit