В този урок ще засегна накратко за такива неща като плаващи блокове. Като цяло. използване на плувка, можете да създадете различни ефекти, а дори и на дизайна на страниците, така наречените блок дизайн. По-голямата част от съвременните уеб сайтове са изградени в съответствие с модулен принцип. Ето защо, струва ми се. това е много важно да се разбере как работи!
По този начин, плаващ блок в CSS плувка собственост, са определени.
Този имот определя дали плаващ блок и в каква посока ще се движи. Имотът може да предприеме следните стойности.
- лявата - структурна единица се премества наляво. Останалите съдържанието на документа ще бъдат показани по дясната страна на кутията, като се започне най-отгоре.
- Точно така - структурно звено се движи надясно. Останалите съдържанието на документа се показва в лявата част на устройството започва от върха.
- няма - уредът не се движи (настройката по подразбиране).
Ами, например, ще бъде поставен по подразбиране, три квадратен блок със страна 200 пиксела.
Както можете да видите, по подразбиране, всеки следващ блок, намиращ се под предишното.
Използване на плувка имота може да се направи така, че всеки блок да изскочи отляво, т.е. тя ще изглежда така:
Ето как ще изглежда, ако блоковете ще изплуват на правото:
Класически пример за приложение - това е, когато е необходимо да се направи текста показва в колони. Нека да има три тонколони.
В HTML-код, само за да направи необходимите текст в съответните колони, DIV тагове
Има една универсална истина във вземането на сайта: За да направите websitet.
Ако сте като по-голямата част от хора, които мислят.
Има една универсална истина в уебсайт.
Говорейки за плаващ блок, ние също трябва да се спомене-чистият имот специфично свойство да позволява сигурен начин да се позиционира плаващите единици.
- лявата - блок трябва да се намира по-долу всички в лявата страна плувките.
- Точно така - блок трябва да се намира по-долу всички десни плаващи единици.
- и двете - блок трябва да се намира по-долу всички плаващи блокове.
- няма - няма никакви ограничения за позицията на единица спрямо движещите се тела не се налага.
Е, нека да кажем, че има оставени две плаващ блок (поплавъка: ляво;), която се увива около текста.
Ако целият текст в блока, и ясно посочват имот: ДВАТА т.е. че той е бил поставен по-долу всички плаващи блокове, можете да се отървете от потока около блок от текст.
Има една универсална истина в уебсайт.
Имайте предвид, че блоковете могат да бъдат разположени почти всичко (снимки, списъци, текст и т.н.).
Ето още един пример, когато един блок се намира под друга, и двете блок увити текст.
Има една универсална истина в уебсайт.
Като цяло, използването на опции може да бъде много. Експеримент, ако искате.
Ако искате да видите как да използвате плаващи блокове, за да се създаде рамка, сайт, отидете тук.
↑ горе ↑
Свързани статии