Авторский знак. Seosait21.ru Есть у человека надежда. Пока не поздно. Вгрызайся и изучай.
Нажимай и поддержи.

Пн Вт Ср Чт Пт Сб Вс
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30


Чувашия-это моя Россия

Ссылки на каскадные стили CSS - box-flex.

Поддержка Браузеров

Internet Explorer Интернет эксплорер Google Chrome Google Chrome Opera Опера Firefox Firefox Safari Сафари.

Свойство box-flex поддерживается только Opera. Internet Explorer 10 поддерживает альтернативы -ms-box-flex . Firefox поддерживает альтернативу-moz-box-flex. Safari и Chrome поддерживают альтернативу-webkit-box-flex. Внимание!!! Гибкие коробки box-flex не поддерживаются в Internet Explorer 9 и более ранних версий.

Определение и использование. Свойство box-flex указывает являются гибким или негибким в размерах. Элементы, которые являются гибкими могут сжиматься или расти, как коробка сжимается и растет. Всякий раз, когда есть дополнительное пространство в коробке, гибкие элементы расширяются, чтобы заполнить это пространство.

Самое мощное здесь даже не в том, что производится некое изменение некого участка страницы сайта. Самое мощное здесь в том, что свойство box-flex, которое действует через стили CSS3 автономно работает даже при отключения JavaScripta в браузере Вашего компьютера.


Синтаксис:

                 box-flex: value;

Пишем программу - Определить два гибких элемента, если родитель имеет 300px, #p1 - 100px и #p2 - 200px:

< !DOCTYPE html>
< html>
< head>
< style> 
div
{
display:-moz-box; /* Firefox */
display:-webkit-box; /* Safari and Chrome */
display:-ms-flexbox; /* Internet Explorer 10 */
display:box;
width:300px;
border:1px solid red;
}

#p1
{
-moz-box-flex:1.0; /* Firefox */
-webkit-box-flex:1.0; /* Safari and Chrome */
-ms-flex:1.0; /* Internet Explorer 10 */
box-flex:1.0;
border:1px solid yellow;
}

#p2
{
-moz-box-flex:2.0; /* Firefox */
-webkit-box-flex:2.0; /* Safari and Chrome */
-ms-flex:2.0; /* Internet Explorer 10 */
box-flex:2.0;
border:1px solid blue;
}
< /style>
< /head>
< body>

< div>
< div id="p1">ПРИВЕТ!!!< /div>
< div  id="p2">ВСЕМ ВСЕМ ВСЕМ< /div >
< /div>

< p>< b>Внимание!!!< /b> Гибкие контейнеры не поддерживается в IE 9 
и более ранних версий.< /p>

< /body>
< /html>                      

Результат программы:

ПРИВЕТ!
ВСЕМ

Внимание!!! Гибкие контейнеры не поддерживается в IE 9 и более ранних версий.




seosait21.ru
HTML

seosait21.ru
CSS

seosait21.ru
Web-диз.
HTML ссылка CSS ссылка ...

seosait21.ru
JavaScript

seosait21.ru
PHP

seosait21.ru
JQuery
JavaScript ссылка PHP ссылка JQuery ссылка

seosait21.ru
SEO.

seosait21.ru
MySQL

seosait21.ru
XML
... ... ...

обратно на главную     назад    дальше     вперед

ПОНРАВИЛОСЬ?
ПОДЕЛИСЬ с ДРУЗЬЯМИ: