JQuery UI пример - складной панель (аккордеон)
В пределах ограниченного пространства отображения для представления контента информации разборную панели.
Для получения более подробной информации о аккордеона части см API документации элемент складывания панели (аккордеона виджетов) .
По умолчанию функция
Нажмите на голову, чтобы развернуть / свернуть содержимое делится на различные части логики, как вкладки (вкладок) то же самое. При желании можно настроить при наведении указателя мыши, следует ли переключаться, чтобы открыть различные части включения / выключения статуса.
Основные теги HTML представляют собой серию заголовка (H3 теги) и содержимого DIV, поэтому содержание может быть использован без прохождения через JavaScript.
<! DOCTYPE HTML>
<HTML LANG = "EN">
<Head>
<Meta Charset = "UTF-8">
<Title> JQuery UI аккордеон (аккордеон) - функция по умолчанию </ title>
<Link отн = "таблица стилей" HREF = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<Script SRC = "// code.jquery.com/jquery-1.9.1.js"> </ скрипт>
<Script SRC = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </ скрипт>
<Link отн = "таблица стилей" HREF = "http://jqueryui.com/resources/demos/style.css">
<Script>
$ (Function () {
$ ( "#accordion") .accordion ();
});
</ Script>
</ Head>
<Body>
<Div ID = "гармошка">
<H3> Часть 1 </ h3>
<Div>
<P>
Mauris mauris анте, blandit и др, ultrices а, suscipit Eget, Quam. Целое
ут neque. Vivamus НИСИ Метус, molestie Vel, gravida в, condimentum сидеть
Амет, Nunc. Нам nibh. Донец suscipit эроса. Нам миль. Proin viverra Лев ут
Одио. Curabitur malesuada. преддверия велит ес анте scelerisque vulputate.
</ P>
</ Div>
<H3> Часть 2 </ h3>
<Div>
<P>
Sed не Урна. Донец и др анте. Phasellus ес язычок. Преддверия сидеть Амет
Purus. Vivamus hendrerit, Dolor в aliquet laoreet, mauris turpis porttitor
велит, faucibus interdum Tellus либеро AC Justo. Vivamus не Квам. В
suscipit faucibus Урна.
</ P>
</ Div>
<H3> раздел 3 </ h3>
<Div>
<P>
Нам enim пзиз, molestie и др, ас Порта, aliquam ас, пзиз. Quisque lobortis.
Phasellus pellentesque Пурус в Массе. Aenean в Pede. Phasellus AC либеро
AC Tellus pellentesque зетрег. Sed ас Felis. Sed Commodo, магна Quis
лациния ornare, Квам анте aliquam НИСИ, Eu iaculis Лев Purus venenatis дуй.
</ P>
<Ul>
<Li> Элемент списка один элемент </ li>
<Li> Элемент списка два </ li>
<Li> Элемент списка три </ li>
</ UL>
</ Div>
<H3> Часть 4 </ h3>
<Div>
<P>
Крас изречение. Pellentesque обитатель MORBI tristique senectus и др Netus
ET malesuada FAMEs AC turpis экскретов. преддверия анте Ipsum primis в
faucibus Орси luctus др ultrices Дознание cubilia Curae; Aenean лациния
mauris Vel оцен.
</ P>
<P>
Suspendisse ес nisl. Nullam ут либеро. Integer dignissim consequat Lectus.
Класс aptent taciti sociosqu объявления litora torquent в conubia ностра, за
inceptos himenaeos.
</ P>
</ Div>
</ Div>
</ Body>
</ HTML>
Складные содержание
По умолчанию обрушения панелей всегда остаются частью открыта. Чтобы дать все детали сложены, можно установить collapsible возможность верно. Нажмите на текущей открытой секции, чтобы свернуть его содержимого панели.
<! DOCTYPE HTML>
<HTML LANG = "EN">
<Head>
<Meta Charset = "UTF-8">
<Title> JQuery UI аккордеон (аккордеон) - складная содержание </ title>
<Link отн = "таблица стилей" HREF = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<Script SRC = "// code.jquery.com/jquery-1.9.1.js"> </ скрипт>
<Script SRC = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </ скрипт>
<Link отн = "таблица стилей" HREF = "http://jqueryui.com/resources/demos/style.css">
<Script>
$ (Function () {
$ ( "#accordion") .accordion ({
сборно-разборные: правда
});
});
</ Script>
</ Head>
<Body>
<Div ID = "гармошка">
<H3> Часть 1 </ h3>
<Div>
<P> Mauris mauris анте, blandit и др, ultrices а, suscipit Eget, Квам. Integer ут neque. Vivamus НИСИ Метус, molestie Vel, gravida в, condimentum сидят Амет, Nunc. Nam nibh. Донец suscipit эроса. Nam ми. Proin viverra Лев ут Одио. Curabitur malesuada. преддверия велит ес анте scelerisque vulputate. </ p>
</ Div>
<H3> Часть 2 </ h3>
<Div>
<P> Sed не Урна. Донец и др анте. Phasellus ес язычок. Преддверия сидеть Амет Purus. Vivamus hendrerit, Dolor на aliquet laoreet, mauris turpis porttitor велит, faucibus interdum Tellus либеро переменного тока Хусто. Vivamus не Квам. В suscipit faucibus Урна. < / р>
</ Div>
<H3> раздел 3 </ h3>
<Div>
<P> Нам enim пзиз, molestie и др, Porta ас, aliquam ас, пзиз. Quisque lobortis. Phasellus pellentesque Пурус в Массе. Aenean в Pede. Phasellus AC либеро AC Tellus pellentesque зетрег. Sed AC Felis. Сед Commodo, магна Quis лациния ornare , Квам анте aliquam НИСИ, Eu iaculis Лев Purus venenatis дуй. </ p>
<Ul>
<Li> Элемент списка один элемент </ li>
<Li> Элемент списка два </ li>
<Li> Элемент списка три </ li>
</ UL>
</ Div>
<H3> Часть 4 </ h3>
<Div>
<P> Крас изречение Pellentesque обитатель MORBI tristique senectus и др Netus др malesuada FAMEs AC turpis экскретов преддверия анте Ipsum primis в faucibus Орси luctus др ultrices Дознание cubilia Curae; .. Aenean лациния mauris Vel Эст </ p> <p> Suspendisse ес nisl. . Nullam ут либеро. Integer dignissim consequat Lectus. Класс aptent taciti sociosqu объявление litora torquent на conubia ностра, в inceptos himenaeos. </ p>
</ Div>
</ Div>
</ Body>
</ HTML>
Иконки
С помощью icons опций для настройки значок заголовка, icons возможность принять название по умолчанию и активировать (открытый) класс состояния. Используйте структуру UI CSS любого класса, или создать пользовательский класс использовать фоновое изображение.
<! DOCTYPE HTML>
<HTML LANG = "EN">
<Head>
<Meta Charset = "UTF-8">
<Title> JQuery UI аккордеон (аккордеон) - Пользовательский значок </ title>
<Link отн = "таблица стилей" HREF = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<Script SRC = "// code.jquery.com/jquery-1.9.1.js"> </ скрипт>
<Script SRC = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </ скрипт>
<Link отн = "таблица стилей" HREF = "http://jqueryui.com/resources/demos/style.css">
<Script>
$ (Function () {
вар иконки = {
заголовок: "UI-значок круга со стрелкой-е",
activeHeader: "UI-значок круга со стрелкой-s"
};
$ ( "#accordion") .accordion ({
иконки: иконки
});
$ ( "#toggle") .button (). Нажмите кнопку (функция () {
если ($ ( "#accordion") .accordion ( "вариант", "иконки")) {
$ ( "#accordion") .accordion ( "Option", "иконки", NULL);
} Else {
$ ( "#accordion") .accordion ( "Вариант", "иконки", иконки);
}
});
});
</ Script>
</ Head>
<Body>
<Div ID = "гармошка">
<H3> Часть 1 </ h3>
<Div>
<P> Mauris mauris анте, blandit и др, ultrices а, suscipit Eget, Квам. Integer ут neque. Vivamus НИСИ Метус, molestie Vel, gravida в, condimentum сидят Амет, Nunc. Nam nibh. Донец suscipit эроса. Nam ми. Proin viverra Лев ут Одио. Curabitur malesuada. преддверия велит ес анте scelerisque vulputate. </ p>
</ Div>
<H3> Часть 2 </ h3>
<Div>
<P> Sed не Урна. Донец и др анте. Phasellus ес язычок. Преддверия сидеть Амет Purus. Vivamus hendrerit, Dolor на aliquet laoreet, mauris turpis porttitor велит, faucibus interdum Tellus либеро переменного тока Хусто. Vivamus не Квам. В suscipit faucibus Урна. < / р>
</ Div>
<H3> раздел 3 </ h3>
<Div>
<P> Нам enim пзиз, molestie и др, Porta ас, aliquam ас, пзиз. Quisque lobortis. Phasellus pellentesque Пурус в Массе. Aenean в Pede. Phasellus AC либеро AC Tellus pellentesque зетрег. Sed AC Felis. Сед Commodo, магна Quis лациния ornare , Квам анте aliquam НИСИ, Eu iaculis Лев Purus venenatis дуй. </ p>
<Ul>
<Li> Элемент списка один элемент </ li>
<Li> Элемент списка два </ li>
<Li> Элемент списка три </ li>
</ UL>
</ Div>
<H3> Часть 4 </ h3>
<Div>
<P> Крас изречение Pellentesque обитатель MORBI tristique senectus и др Netus др malesuada FAMEs AC turpis экскретов преддверия анте Ipsum primis в faucibus Орси luctus др ultrices Дознание cubilia Curae; .. Aenean лациния mauris Vel Эст </ p> <p> Suspendisse ес nisl. . Nullam ут либеро. Integer dignissim consequat Lectus. Класс aptent taciti sociosqu объявление litora torquent на conubia ностра, в inceptos himenaeos. </ p>
</ Div>
</ Div>
Кнопка <ID = "переключение"> значок переключения </ кнопка>
</ Body>
</ HTML>
Заполнение пространства
Так как складной панель состоит из элементов блочного уровня, и по умолчанию его ширина заливает доступное пространство по горизонтали. Для заполнения вертикального пространства , отведенного контейнером, установите heightStyle опция "fill" , сценарий автоматически установит высоту размера складной панели родительского контейнера.
<! DOCTYPE HTML>
<HTML LANG = "EN">
<Head>
<Meta Charset = "UTF-8">
<Title> JQuery UI аккордеон (аккордеон) - заполнить пространство </ title>
<Link отн = "таблица стилей" HREF = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<Script SRC = "// code.jquery.com/jquery-1.9.1.js"> </ скрипт>
<Script SRC = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </ скрипт>
<Link отн = "таблица стилей" HREF = "http://jqueryui.com/resources/demos/style.css">
<Style>
# Аккордеон-переклассификатор {
обивка: 10px;
ширина: 350 пикселей;
высота: 220px;
}
</ Style>
<Script>
$ (Function () {
$ ( "#accordion") .accordion ({
heightStyle: "заполнить"
});
});
$ (Function () {
$ ( "# Аккордеон-переклассификатор") .resizable ({
MinHeight: 140,
MinWidth: 200,
размер: функция () {
$ ( "#accordion") .accordion ( "Обновить");
}
});
});
</ Script>
</ Head>
<Body>
<H3 класс = "Docs"> перенастроить внешний контейнер: </ h3>
<Div ID = "гармошки переклассификатор" класс = "UI-виджета-контента">
<Div ID = "гармошка">
<H3> Часть 1 </ h3>
<Div>
<P> Mauris mauris анте, blandit и др, ultrices а, suscipit Eget, Квам. Integer ут neque. Vivamus НИСИ Метус, molestie Vel, gravida в, condimentum сидят Амет, Nunc. Nam nibh. Донец suscipit эроса. Nam ми. Proin viverra Лев ут Одио. Curabitur malesuada. преддверия велит ес анте scelerisque vulputate. </ p>
</ Div>
<H3> Часть 2 </ h3>
<Div>
<P> Sed не Урна. Донец и др анте. Phasellus ес язычок. Преддверия сидеть Амет Purus. Vivamus hendrerit, Dolor на aliquet laoreet, mauris turpis porttitor велит, faucibus interdum Tellus либеро переменного тока Хусто. Vivamus не Квам. В suscipit faucibus Урна. < / р>
</ Div>
<H3> раздел 3 </ h3>
<Div>
<P> Нам enim пзиз, molestie и др, Porta ас, aliquam ас, пзиз. Quisque lobortis. Phasellus pellentesque Пурус в Массе. Aenean в Pede. Phasellus AC либеро AC Tellus pellentesque зетрег. Sed AC Felis. Сед Commodo, магна Quis лациния ornare , Квам анте aliquam НИСИ, Eu iaculis Лев Purus venenatis дуй. </ p>
<Ul>
<Li> Элемент списка один элемент </ li>
<Li> Элемент списка два </ li>
<Li> Элемент списка три </ li>
</ UL>
</ Div>
<H3> Часть 4 </ h3>
<Div>
<P> Крас изречение Pellentesque обитатель MORBI tristique senectus и др Netus др malesuada FAMEs AC turpis экскретов преддверия анте Ipsum primis в faucibus Орси luctus др ultrices Дознание cubilia Curae; .. Aenean лациния mauris Vel Эст </ p> <p> Suspendisse ес nisl. . Nullam ут либеро. Integer dignissim consequat Lectus. Класс aptent taciti sociosqu объявление litora torquent на conubia ностра, в inceptos himenaeos. </ p>
</ Div>
</ Div>
</ Div>
</ Body>
</ HTML>
Неавтоматическое высота
Установка heightStyle: "content" , так, чтобы сложенные панели сохраняют свою первоначальную высоту.
<! DOCTYPE HTML>
<HTML LANG = "EN">
<Head>
<Meta Charset = "UTF-8">
<Title> JQuery UI аккордеон (аккордеон) - неавтоматического высота </ title>
<Link отн = "таблица стилей" HREF = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<Script SRC = "// code.jquery.com/jquery-1.9.1.js"> </ скрипт>
<Script SRC = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </ скрипт>
<Link отн = "таблица стилей" HREF = "http://jqueryui.com/resources/demos/style.css">
<Script>
$ (Function () {
$ ( "#accordion") .accordion ({
heightStyle: "содержание"
});
});
</ Script>
</ Head>
<Body>
<Div ID = "гармошка">
<H3> Часть 1 </ h3>
<Div>
<P> Mauris mauris анте, blandit и др, ultrices а, susceros. Нам миль. Proin viverra Лев ут Одио. Curabitur malesuada. Преддверия в ес велит анте scelerisque vulputate. </ P>
</ Div>
<H3> Часть 2 </ h3>
<Div>
<P> Sed не Урна. Донец и др анте. Phasellus ес язычок. Преддверия сидеть Амет Purus. Vivamus hendrerit, Dolor на aliquet laoreet, mauris turpis porttitor велит, faucibus interdum Tellus либеро переменного тока Хусто. Vivamus не Квам. В suscipit faucibus Урна. < / р>
</ Div>
<H3> раздел 3 </ h3>
<Div>
<P> Нам enim пзиз, molestie и др, Porta ас, aliquam ас, пзиз. Quisque lobortis. Phasellus pellentesque Пурус в Массе. Aenean в Pede. Phasellus AC либеро AC Tellus pellentesque зетрег. Sed AC Felis. Сед Commodo, магна Quis лациния ornare , Квам анте aliquam НИСИ, Eu iaculis Лев Purus venenatis дуй. </ p>
<Ul>
<Li> Элемент списка </ li>
<Li> Элемент списка </ li>
<Li> Элемент списка </ li>
<Li> Элемент списка </ li>
<Li> Элемент списка </ li>
<Li> Элемент списка </ li>
<Li> Элемент списка </ li>
</ UL>
</ Div>
</ Div>
</ Body>
</ HTML>
При открытии зависать
Нажмите на голову, чтобы развернуть / свернуть содержимое делится на различные части логики, как вкладки (вкладок) то же самое. При желании можно настроить при наведении указателя мыши, следует ли переключаться, чтобы открыть различные части включения / выключения статуса.
Основные теги HTML представляют собой серию заголовка (H3 теги) и содержимого DIV, поэтому содержание может быть использован без прохождения через JavaScript.
<! DOCTYPE HTML>
<HTML LANG = "EN">
<Head>
<Meta Charset = "UTF-8">
<Title> JQuery UI аккордеон (аккордеон) - При наведении открыто </ title>
<Link отн = "таблица стилей" HREF = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<Script SRC = "// code.jquery.com/jquery-1.9.1.js"> </ скрипт>
<Script SRC = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </ скрипт>
<Link отн = "таблица стилей" HREF = "http://jqueryui.com/resources/demos/style.css">
<Script>
$ (Function () {
$ ( "#accordion") .accordion ({
событие: "нажмите hoverintent"
});
});
/ *
* HoverIntent | Copyright 2011 Брайан Чернэ
* Http://cherne.net/brian/resources/jquery.hoverIntent.html
* Изменен команды JQuery UI
* /
$ .event.special.hoverintent = {
настройка: функция () {
$ (Это) .bind ( "Mouseover", jQuery.event.special.hoverintent.handler);
},
демонтаж: функция () {
$ (Это) .unbind ( "Mouseover", jQuery.event.special.hoverintent.handler);
},
обработчик: функция (событие) {
вар CurrentX, CurrentY, тайм-аут,
Args = аргументы,
цель = $ (event.target),
previousX = event.pageX,
previousY = event.pageY;
Функция дорожки (событие) {
CurrentX = event.pageX;
CurrentY = event.pageY;
};
Функция сброса () {
мишень
.unbind ( "MouseMove", трек)
.unbind ( "MouseOut", ясно);
clearTimeout (тайм-аут);
}
Функция обработчика () {
проп вар,
ориг = событие;
если ((Math.abs (previousX - CurrentX) +
Math.abs (previousY - CurrentY)) <7) {
ясно ();
Событие = $ .Event ( "hoverintent");
для (проп в ориг) {
если (! (проп в случае)) {
Событие [проп] = ориг [проп];
}
}
// Запретить доступ к исходному событию, потому что новое событие будет срабатывать асинхронно, старое событие больше не доступен (# 6028)
удалить event.originalEvent;
target.trigger (событие);
} Else {
previousX = CurrentX;
previousY = CurrentY;
Тайм-аут = setTimeout (обработчик, 100);
}
}
Тайм-аут = setTimeout (обработчик, 100);
target.bind ({
MouseMove: дорожки,
MouseOut: прозрачный
});
}
};
</ Script>
</ Head>
<Body>
<Div ID = "гармошка">
<H3> Часть 1 </ h3>
<Div>
<P>
Mauris mauris анте, blandit и др, ultrices а, suscipit Eget, Quam. Целое
ут neque. Vivamus НИСИ Метус, molestie Vel, gravida в, condimentum сидеть
Амет, Nunc. Нам nibh. Донец suscipit эроса. Нам миль. Proin viverra Лев ут
Одио. Curabitur malesuada. преддверия велит ес анте scelerisque vulputate.
</ P>
</ Div>
<H3> Часть 2 </ h3>
<Div>
<P>
Sed не Урна. Донец и др анте. Phasellus ес язычок. Преддверия сидеть Амет
Purus. Vivamus hendrerit, Dolor в aliquet laoreet, mauris turpis porttitor
велит, faucibus interdum Tellus либеро AC Justo. Vivamus не Квам. В
suscipit faucibus Урна.
</ P>
</ Div>
<H3> раздел 3 </ h3>
<Div>
<P>
Нам enim пзиз, molestie и др, ас Порта, aliquam ас, пзиз. Quisque lobortis.
Phasellus pellentesque Пурус в Массе. Aenean в Pede. Phasellus AC либеро
AC Tellus pellentesque зетрег. Sed ас Felis. Sed Commodo, магна Quis
лациния ornare, Квам анте aliquam НИСИ, Eu iaculis Лев Purus venenatis дуй.
</ P>
<Ul>
<Li> Элемент списка один элемент </ li>
<Li> Элемент списка два </ li>
<Li> Элемент списка три </ li>
</ UL>
</ Div>
<H3> Часть 4 </ h3>
<Div>
<P>
Крас изречение. Pellentesque обитатель MORBI tristique senectus и др Netus
ET malesuada FAMEs AC turpis экскретов. преддверия анте Ipsum primis в
faucibus Орси luctus др ultrices Дознание cubilia Curae; Aenean лациния
mauris Vel оцен.
</ P>
<P>
Suspendisse ес nisl. Nullam ут либеро. Integer dignissim consequat Lectus.
Класс aptent taciti sociosqu объявления litora torquent в conubia ностра, за
inceptos himenaeos.
</ P>
</ Div>
</ Div>
</ Body>
</ HTML>
Сортировка (Сортируемый)
Перетащите заголовок панели, чтобы изменить порядок.
<! DOCTYPE HTML>
<HTML LANG = "EN">
<Head>
<Meta Charset = "UTF-8">
<Title> JQuery UI аккордеон (аккордеон) - сортировка (Сортируемый) </ title>
<Link отн = "таблица стилей" HREF = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<Script SRC = "// code.jquery.com/jquery-1.9.1.js"> </ скрипт>
<Script SRC = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </ скрипт>
<Link отн = "таблица стилей" HREF = "http://jqueryui.com/resources/demos/style.css">
<Style>
/ * При заказе, есть вопросы макета IE (см # 5413) * /
.group {зум: 1}
</ Style>
<Script>
$ (Function () {
$ ( "#accordion")
.accordion ({
заголовок: "> div> h3"
})
.sortable ({
Ось: "у",
ручка: "h3",
остановка: функции (события, Ui) {
// При сортировке, IE не может быть зарегистрирован размытость, поэтому триггер focusout обработчика для удаления .ui-состояние-фокус
ui.item.children ( "h3") .triggerHandler ( "focusout");
}
});
});
</ Script>
</ Head>
<Body>
<Div ID = "гармошка">
<Div класс = "Группа">
<H3> Часть 1 </ h3>
<Div>
<P> Mauris mauris анте, blandit и др, ultrices а, suscipit Eget, Квам. Integer ут neque. Vivamus НИСИ Метус, molestie Vel, gravida в, condimentum сидят Амет, Nunc. Nam nibh. Донец suscipit эроса. Nam ми. Proin viverra Лев ут Одио. Curabitur malesuada. преддверия велит ес анте scelerisque vulputate. </ p>
</ Div>
</ Div>
<Div класс = "Группа">
<H3> Часть 2 </ h3>
<Div>
<P> Sed не Урна. Донец и др анте. Phasellus ес язычок. Преддверия сидеть Амет Purus. Vivamus hendrerit, Dolor на aliquet laoreet, mauris turpis porttitor велит, faucibus interdum Tellus либеро переменного тока Хусто. Vivamus не Квам. В suscipit faucibus Урна. < / р>
</ Div>
</ Div>
<Div класс = "Группа">
<H3> раздел 3 </ h3>
<Div>
<P> Нам enim пзиз, molestie и др, Porta ас, aliquam ас, пзиз. Quisque lobortis. Phasellus pellentesque Пурус в Массе. Aenean в Pede. Phasellus AC либеро AC Tellus pellentesque зетрег. Sed AC Felis. Сед Commodo, магна Quis лациния ornare , Квам анте aliquam НИСИ, Eu iaculis Лев Purus venenatis дуй. </ p>
<Ul>
<Li> Элемент списка один элемент </ li>
<Li> Элемент списка два </ li>
<Li> Элемент списка три </ li>
</ UL>
</ Div>
</ Div>
<Div класс = "Группа">
<H3> Часть 4 </ h3>
<Div>
<P> Крас изречение Pellentesque обитатель MORBI tristique senectus и др Netus др malesuada FAMEs AC turpis экскретов преддверия анте Ipsum primis в faucibus Орси luctus др ultrices Дознание cubilia Curae; .. Aenean лациния mauris Vel Эст </ p> <p> Suspendisse ес nisl. . Nullam ут либеро. Integer dignissim consequat Lectus. Класс aptent taciti sociosqu объявление litora torquent на conubia ностра, в inceptos himenaeos. </ p>
</ Div>
</ Div>
</ Div>
</ Body>
</ HTML>