Различия

Показаны различия между двумя версиями страницы.

--- software:development:demo:start [2023/08/18 01:27] – [Examples/Usage] vladpolskiy
+++ software:development:demo:start [2024/02/26 21:52] (текущий) – [css 3d flip cart] vladpolskiy
@@ Строка 65: / Строка 65: @@
     малой яркостью светящейся поверхности, близким к естественному спектральным
     составом излучаемого света, что обеспечивает хорошую цветопередачу.</p>
+	 </body>
+</html>
+===== Всплывающая подсказка =====
+<code>
+<autott>
+  <content>В этом месте всплывающая подсказка.</content>
+    <title>Это заглавие подсказки.</title>
+    <tip>Это текст подсказки.</tip>
+</autott>
+</code>
+<autott>
+  <content>В этом месте всплывающая подсказка.</content>
+    <title>Это заглавие подсказки.</title>
+    <tip>Это текст подсказки.</tip>
+</autott>
 =====77777=====
+<html>
 <iframe height="300" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code/index.htm" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
-  See the Pen <a href="https://codepen.io/html5book/pen/qaOjYR">
-  Untitled</a> by Elena (<a href="https://codepen.io/html5book">@html5book</a>)
-  on <a href="https://codepen.io">CodePen</a>.
 </iframe>
- </body>
-</html>
+<iframe height="300" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code/Change animation with JavaScript.htm" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+<iframe height="300" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code/Slideshow container.htm" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+<iframe height="500" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code/Modal Login Form.htm" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+https://html5css.ru/howto/howto_css_login_form.php
 =====8956=====
@@ Строка 130: / Строка 153: @@
 ===== Examples/Usage =====
-See the plugin in action [[https://servidordebian.org/en/blog/2015/08_24_dokuwiki-plugin-socialite|here]]. The sample page shows all the styles available with the plugin.
+~~socialite~~''
-To add the lightweight social share buttons just at the tag '' ~~socialite~~'' anywhere in you page. From the //Dokuwiki configuration page//, you can select three visualization options (''color''(default), ''name'', ''icon'') and the list of social buttons do display.
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_image_border.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== css rotation animation =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_rotation_animation.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
-Option ''Display: color''. This option only uses css styles, so it is really lightweight:
+===== css 3d flip cart =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_3d_flip_cart.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+[[https://book51.ru/demo/code/3d_flip_cart/index.html|Демо страницы]]
-{{https://servidordebian.org/_media/en/blog/2015/dokuwiki-plugin-socialite-color.png?}}
+===== css starry sky animation =====
-Option ''Display: name''. Displays the social share icon and name:
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_starry_sky_animation.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
-{{https://servidordebian.org/_media/en/blog/2015/dokuwiki-plugin-socialite-name.png?}}
+===== css starry sky animation 2 =====
-Option ''Display: icon''. Displays a small button wit the social network icon:
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_starry_sky_animation_2.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== css starry sky animation 2 =====
+<html>
+<iframe height="1800" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/img/Генератор input checkbox CSS _ Style CSS.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== ФОНОВОЕ ИЗОБРАЖЕНИЕ В CSS =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_images.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== ЗАТЕМНЕНИЕ ИЗОБРАЖЕНИЯ С ПОМОЩЬЮ CSS =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_images_1.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== ИЗОБРАЖЕНИЕ С РАЗМЕРАМИ С ПОМОЩЬЮ CSS =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_images_2.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== АДАПТИВНАЯ КАРТИНКА CSS =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_images_3.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_images_4.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== РАМКА ВОКРУГ КАРТИНКИ CSS =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_images_5.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== СКРУГЛЕНИЕ УГЛОВ КАРТИНКИ CSS =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_images_6.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== СОТРАЖЕНИЕ КАРТИНКИ ПО ГОРИЗОНТАЛИ И ВНРТИКАЛИ CSS =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_images_7.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== ПОВОРОТ ИЗОБРАЖЕНИЯ CSS =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_images_8.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== КАРТИНКА ССЫЛКА CSS/HTML =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_images_9.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== ЧЕРНО-БЕЛАЯ КАРТИНКА CSS =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_images_10.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== КРУГЛОЕ ИЗОБРАЖЕНИЕ CSS =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_images_11.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
+===== ОБТЕКАНИЕ КАРТИНКИ ТЕКСТОМ CSS /HTML =====
+<html>
+<iframe height="350" style="width: 100%;" scrolling="no" title="Untitled" src="./demo/code-docs/pages/lessons/css_images_12.html" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
+</iframe>
+</html>
-{{https://servidordebian.org/_media/en/blog/2015/dokuwiki-plugin-socialite-icon.png?}}