Strona główna : Warunki internetowe : Definicja układu płynnego

Układ płynny

Płynny układ to rodzaj strona projekt, w którym układ strony zmienia rozmiar jako okno rozmiar jest zmieniony. Osiąga się to poprzez definiowanie obszarów strony za pomocą procentów zamiast stałych piksel szerokości.

Większość układów stron internetowych zawiera jedną, dwie lub trzy kolumny. We wczesnych dniach projektowanie stron internetowychGdy większość użytkowników miała podobne rozmiary ekranu, twórcy stron internetowych przypisywali kolumnom stałą szerokość. Na przykład stały układ może zawierać główny obszar zawartości o szerokości 960 pikseli z trzema kolumnami o szerokości 180 pikseli, 600 pikseli i 180 pikseli. Chociaż ten układ może wyglądać świetnie na ekranie 1024x768, może wyglądać na mały na ekranie 1920x1080 i nie pasowałby do ekranu 800x600.

Układy płynne rozwiązują ten problem, używając wartości procentowych do zdefiniowania każdego obszaru układu. Na przykład zamiast tworzyć obszar zawartości o rozmiarze 960 pikseli, plik programista internetowy może stworzyć układ, który zajmuje 80% ekranu, a trzy kolumny mogą zajmować odpowiednio 18%, 64% i 18%. Używając wartości procentowych, zawartość może się rozszerzać lub zmniejszać, dopasowując się do okna komputera użytkownika. Plik CSS używany do tworzenia układu stałego w porównaniu z układem płynnym pokazano poniżej.

Układ stałyUkład płynny
.content {width: 960px; }
.left, .right {width: 180px; }
.middle {width: 600px; }
.content {width: 80%; }
.left, .right {szerokość: 18%; }
.middle {width: 64%; }

Każda z klas CSS w przykładach może być przypisana do elementu div na stronie HTML gdzie .lewo, .dobrze, .środkowy klasy są zawarte w .zadowolony klasa. Klasa treści może być również przypisana do tabeli, a inne klasy mogą być przypisane do komórek tabeli. Stała szerokość .zadowolony class nie wymaga zdefiniowanej szerokości, ponieważ automatycznie rozciąga się na szerokość zawartych elementów div lub komórek tabeli.

Układ płynny a projektowanie responsywne

Terminy „układ elastyczny” i „responsywny projekt strony”są czasami używane zamiennie, ale są to dwie różne rzeczy. Strona utworzona przy użyciu elastycznego projektowania witryn zawiera zapytania o media CSS, które ładują różne style w zależności od szerokości okna lub typu urządzenia używanego do uzyskania dostępu do strony. Elastyczne projektowanie witryn internetowych wymaga więcej CSS (a czasem JavaScript) niż podstawowy układ płynny, ale zapewnia też większą kontrolę nad układem strony.

https://TechLib.com/definition/fluid_layout

TechLib - słownik komputerowy Tech Lib

Ta strona zawiera techniczną definicję Fluid Layout. Wyjaśnia w terminologii komputerowej, co oznacza Fluid Layout i jest jednym z wielu terminów internetowych w słowniku TechLib.

Wszystkie definicje na stronie TechLib są napisane tak, aby były dokładne pod względem technicznym, ale także łatwe do zrozumienia. Jeśli uznasz tę definicję Fluid Layout za pomocną, możesz odwołać się do niej, korzystając z linków cytowania powyżej.