5.00 / 1 oy

CSS Flexbox flex Özelliği Nedir ve Nasıl Kullanılır?

Dünkü flexbox yazılarım arasında bahsettiğim flex-flow özelliğinin yeni bir araç olmadığını, bunun yerine flex-direction ve flex-wrap özelliklerini tek satırda yazabilmeyi sağlayan bir özellik olduğunu örnekle göstermiştim. Flexbox'ta bize kolaylık sağlayan bir diğer özellik de flex özelliğidir ve flex-grow, flex-shrink ve flex-basis özelliklerini tek seferde aralarında boşluk bırakarak yazabilmemizi sağlar.

flex özelliği, aralarına boşluk bırakılarak 3 parametre ile ve parametrelerinin anlamları şu sırayla kullanılabilir:

1: flex-grow

2: flex-shrink

3. flex-basis

Örnek olarak aşağıdaki css kodları aynı anlama gelmiş olacaktır:

/* flex-grow: 2; flex-shrink: 1; flex-basis: 300px; */
flex: 2 1 300px;

CSS'teki margin özelliği gibi sadece 1 ya da 2 parametre olarak kullanıldığında da ilgili flex özelliği ile sınırlanır.

BasParmak

28.06.2020 16:45

Bu soru henüz yanıtlanmamış.

Bu soruya sadece kayıtlı kullanıcılar yanıt yazabilirler. Yanıt yazmak için lütfen giriş yapınız.

Reitix
CSS Flexbox flex Özelliği Nedir ve Nasıl Kullanılır?

İnternet sitemizdeki deneyiminizi iyileştirmek için çerezler kullanıyoruz. Bu siteye giriş yaparak çerez kullanımını kabul etmiş sayılıyorsunuz. Daha fazla bilgi.