Şablon:Yatay Liste: Revizyonlar arasındaki fark
Gezinti kısmına atla
Arama kısmına atla
(Yeni sayfa: "<includeonly><div style="display: grid;grid-gap: {{#if:{{{aralık|}}}|{{{aralık}}}|20}}px;grid-template-columns: repeat(auto-fit, minmax({{#if:{{{asgari-genişlik|}}}|{{{asgari-gen...") |
(Örnek düzeltildi.) |
||
1. satır: | 1. satır: | ||
<includeonly><div style="display: grid;grid-gap: {{#if:{{{aralık|}}}|{{{aralık}}}|20}}px;grid-template-columns: repeat(auto-fit, minmax({{#if:{{{asgari-genişlik|}}}|{{{asgari-genişlik}}}|300}}px, 1fr) );">{{{içerik}}}</div></includeonly> | <includeonly><div style="display: grid;grid-gap: {{#if:{{{aralık|}}}|{{{aralık}}}|20}}px;grid-template-columns: repeat(auto-fit, minmax({{#if:{{{asgari-genişlik|}}}|{{{asgari-genişlik}}}|300}}px, 1fr) );">{{{içerik|}}}</div></includeonly> | ||
<noinclude> | <noinclude> | ||
Her ekran çözünürlüğüne uygun olarak alt elemanları yan yana listeler. Alt elemanların genişliği en az <code>|asgari-genişlik=</code> parametresiyle belirtilen değer ve en fazla tam genişlik olacak şekilde genişlik otomatik hesaplanarak en ideal şekilde alt elemanları yan yana listelemeye çalışır. | Her ekran çözünürlüğüne uygun olarak alt elemanları yan yana listeler. Alt elemanların genişliği en az <code>|asgari-genişlik=</code> parametresiyle belirtilen değer ve en fazla tam genişlik olacak şekilde genişlik otomatik hesaplanarak en ideal şekilde alt elemanları yan yana listelemeye çalışır. | ||
18. satır: | 18. satır: | ||
'''NOT: Ekran genişliğini arttırıp/azaltıp değişiklikleri gözlemleyebilirsiniz.''' | '''NOT: Ekran genişliğini arttırıp/azaltıp değişiklikleri gözlemleyebilirsiniz.''' | ||
<code><nowiki>{{Yatay Liste|asgari-genişlik=250|aralık=20|içerik=<div style="background-color: red;min-height: 50px" /><div style="background-color: blue;min-height: 50px" /><div style="background-color: yellow;min-height: 50px" /><div style="background-color: green;min-height: 50px" />}}</nowiki></code> | <code><nowiki>{{Yatay Liste|asgari-genişlik=250|aralık=20|içerik=<div style="background-color: red;min-height: 50px"></div><div style="background-color: blue;min-height: 50px"></div><div style="background-color: yellow;min-height: 50px"></div><div style="background-color: green;min-height: 50px"></div>}}</nowiki></code> | ||
{{Yatay Liste|asgari-genişlik=250|aralık=20|içerik=<div style="background-color: red;min-height: 50px" /><div style="background-color: blue;min-height: 50px" /><div style="background-color: yellow;min-height: 50px" /><div style="background-color: green;min-height: 50px" />}} | |||
{{Yatay Liste|asgari-genişlik=250|aralık=20|içerik=<div style="background-color: red;min-height: 50px"></div><div style="background-color: blue;min-height: 50px"></div><div style="background-color: yellow;min-height: 50px"></div><div style="background-color: green;min-height: 50px"></div>}} | |||
[[Kategori:Şablonlar]] | [[Kategori:Şablonlar]] | ||
</noinclude> | </noinclude> |
03.08, 3 Kasım 2018 itibarı ile sayfanın şu anki hâli
Her ekran çözünürlüğüne uygun olarak alt elemanları yan yana listeler. Alt elemanların genişliği en az |asgari-genişlik=
parametresiyle belirtilen değer ve en fazla tam genişlik olacak şekilde genişlik otomatik hesaplanarak en ideal şekilde alt elemanları yan yana listelemeye çalışır.
Kullanım
Bu şablon için kullanılabilecek parametreler aşağıda tanımlanmıştır.
|asgari-genişlik=
- Alt elemanlar için asgari genişliği belirtir. Eğer tanımlanmazsa "300" değeri varsayılan olarak kullanılır.
|aralık=
- Her alt eleman arasındaki yatay/dikey boşluğun boyutunu belirtir. Eğer tanımlanmazsa "20" değeri varsayılan olarak kullanılır.
|içerik=
- Alt elemanların belirtildiği yerdir.
Örnek
NOT: Ekran genişliğini arttırıp/azaltıp değişiklikleri gözlemleyebilirsiniz.
{{Yatay Liste|asgari-genişlik=250|aralık=20|içerik=<div style="background-color: red;min-height: 50px"></div><div style="background-color: blue;min-height: 50px"></div><div style="background-color: yellow;min-height: 50px"></div><div style="background-color: green;min-height: 50px"></div>}}