Архив рубрики: 免费网站脚本

免费脚本和各种效果

CSS列表标记

Опубликовано 2019-03-29 автором stariс

使用图片作为列表标记是与页面加载速度相关的不可接受的奢侈品，特别是对于年轻的网站。 因此，我将向您展示一些如何仅使用html和css创建标记的示例。 作为标记的容器，使用单个 标记，因为它通常在列表中，而不是块元素。 广场 代码 名单 名单 圆 代码 名单 名单 三角形 代码 名单 名单 名单 名单 蜱 代码 名单 名单 心脏 代码 名单 名单 符号 代码. 您可以使用任何字符或特殊字符作为标记。     广场 CSS .squar { list-style: none; font-size: 20px; } … Читать далее →

Рубрика: 免费网站脚本 | Оставить комментарий

菜单图标在CSS中绘制

Опубликовано 2019-03-29 автором stariс

如何使菜单图标不是图片，而是用html + css写。 在我使网站设计响应之后，我有了这个问题，并在菜单的图标上放置了一个漂亮的菜单，我切入Yandex Pictures。 在一个清晰的早晨，创造的快乐已经像雾一样消失，经过另一次检查网站的下载速度。 之前改编的每张微小图片都加载了大约200毫秒。 带有html的实心脚布加载速度更快。 就在那时我决定尝试用代码编写图标，这就是发生的事情。 我制作的图标大小为40 x 40像素，以便更好地查看，但通过在代码中更改此数字，您可以为自己制作任何尺寸。 @ 邮件 代码   ✎ 写 代码   ≡ 菜单 代码   家 代码   设置 代码   启动 代码   评论 代码   邮件 CSS .letter { … Читать далее →

Рубрика: 免费网站脚本 | Оставить комментарий

Javascript滑块

Опубликовано 2019-03-29 автором stariс

最简单的javascript滑块，代码非常简单，适用于我测试过的所有模板。 您可以根据需要添加任意数量的图片。 所有这些都将以指定的间隔出现。 HTML <div id=»carousels»> <div class=»carousel demonstration»><img src=»images/1.jpg»></div> <div class=»carousel»><img src=»images/2.jpg»></div> <div class=»carousel»><img src=»images/3.jpg»></div> </div> Javascript <script> var carousels = document.querySelectorAll(‘#carousels .carousel’); var currentCarousel = 0; var carouselInterval = setInterval(nextCarousel,5000); /* Интервал между картинками */ function nextCarousel(){ carousels[currentCarousel].className … Читать далее →

Рубрика: 免费网站脚本 | Оставить комментарий

CSS滑块

Опубликовано 2019-03-29 автором stariс

这是最简单的CSS滑块。 这种滑块的优点包括易用性和安全性，以及即使是新手网站管理员也可以在您的网站上完成和安装。 缺点是不可能单独在CSS上重复循环。 但是如果你认为八张图片的滚动时间超过30秒，那么这个时间足以让访问者查看该页面。 如果滑块安装在网站的标题中，那么没人会考虑半分钟。 图片外观的效果可以根据自己的喜好进行更改，并符合CSS3的功能。 让我们看看它在哪里以及如何完成。 代码: <!DOCTYPE html> <html lang=»ru»> <head> <meta charset=»utf-8″ /> <title>CSS滑块</title> <style> /* 滑块 */ #slaid { /* 设置相对定位 */ position: relative; /*Размер и рамка блока*/ width: 400px; height: 200px; border: 2px solid #333; … Читать далее →

Рубрика: 免费网站脚本 | Оставить комментарий

动画网站标题示例

Опубликовано 2019-03-29 автором stariс

以下是创建网站标题的一些想法。 您可以按原样使用它，也可以只采取一些操作并将其应用于开发自己的标题或广告横幅设计。 弹出标题和网站描述。 网站名称 网站描述 网站描述网站描述 网站描述网站描述 网站描述 代码 1: 要再次查看此动画的工作 — 刷新页面。.   花 网站名称 代码 2:   流星 网站名称 代码 3: 白天和黑夜 Safari Africa Egypt 代码 4: 代码 1 <!DOCTYPE html> <html lang=»ru»> <head> <meta charset=»utf-8″ /> <title>文件</title> … Читать далее →

Рубрика: 免费网站脚本 | Оставить комментарий

有关图像，示例和现成代码的文字

Опубликовано 2019-03-29 автором stariс

悬停光标时，文本在图像上出现的五个原始效果。 选项1 文本显示在图像的底部。 代码 选项 2 文本从图像的深处出现，旋转。 代码 Вариант 3 文本从图像的边缘绘制。 代码 Вариант 4. 此变体与之前的变体的不同之处在于弹出文本不是输入到链接中，而是输入到包含链接的块中。 在自定义属性中放置文本 data. 在该实施例中，除了描述之外，还显示图片的标题。 代码 Вариант 5 3D 效果 银色湖在Zvenigovsky区，Mari El，俄罗斯。 它位于Suslongersky林业的领土上。 湖泊位于Yushut河流域。 代码 代码 1: <!DOCTYPE html> <html lang=»ru»> <head> <meta charset=»utf-8″ /> <title>文件</title> <style> … Читать далее →

Рубрика: 免费网站脚本 | Оставить комментарий

CSS活着的心

Опубликовано 2019-03-29 автором stariс

这是另一种创造运动的原始CSS效果，而运动就是已知的生命。 如果您使用数字，就这些元素的含义而言，您将看到非常有趣的效果，在这些效果下，您不仅可以替换心形块，还可以替换更多。 一切都取决于你的想象力。 工作心脏由两个块组成，并且从下面向第二个块添加三角形。 <!DOCTYPE html> <html lang=»ru»> <head> <meta charset=»utf-8″ /> <title>文件</title> <style> @keyframes bounce { from, to { -webkit-transform: translateY(10vh) scaleY(.98); transform: translateY(10vh) scaleY(.98); } 80% { -webkit-transform: translateY(10vh) scaleY(1.02); transform: translateY(10vh) scaleY(1.02); } } .serdse { border-radius: … Читать далее →

Рубрика: 免费网站脚本 | Оставить комментарий

星雨

Опубликовано 2019-03-29 автором stariс

非常轻量级的代码，只有html和css，所以你可以将它粘贴到任何地方，甚至在用PHP编写的CMS中，甚至在简单的html页面中。 可以根据需要增加恒星的数量和大小。 HTML <div class=»space»> <div class=»stars1″></div> <div class=»stars2″></div> <div class=»stars3″></div> <div class=»stars4″></div> <div class=»stars5″></div> <div class=»stars6″></div> <div class=»stars7″></div> <div class=»stars8″></div> <div class=»stars9″></div> <div class=»stars10″></div> </div> SCC .space { width: 600px; height: 300px; /* 背景 — 满天星斗的天空的片段的图片 默认情况下，它乘以整个块 */ background-image: … Читать далее →

Рубрика: 免费网站脚本 | Оставить комментарий

旋转CSS立方体

Опубликовано 2019-03-29 автором stariс

想在您的网站上使用多维数据集 没有什么比这更容易，因为它是用html和css编写的，没有脚本和库。 这是这个多维数据集的代码。 <!DOCTYPE html> <html lang=»ru»> <head> <meta charset=»utf-8″ /> <title>文件</title> <style> .wrap { -webkit-perspective: 500px; -ms-perspective: 500px; perspective: 500px; -webkit-perspective-origin: 50% 50%; -ms-perspective-origin: 50% 50%; perspective-origin: 50% 50%; float: left; margin-right: 100px; } .cube { position: relative; margin: … Читать далее →

Рубрика: 免费网站脚本 | Оставить комментарий

CSS浮动块

Опубликовано 2019-03-29 автором stariс

移动光标 您好亲爱的新手网站管理员。 每个人在悬停时都会遇到动画菜单项和其他项目。 此效果由CSS属性transform创建，并由属性创建3D效果 box-shadow. 移动的大小和方向由属性 transform 设置，通过更改此属性中的值，您不仅可以设置任何方向的线性移动，还可以设置给定角度的倾斜。 本文开头的元素示例。 代码: <!DOCTYPE html> <html lang=»ru»> <head> <meta charset=»utf-8″ /> <title>文件</title> <style> .element { color: rgba(0, 0, 0, 0.8); padding: 30px 5px 0 5px; position: relative; display: inline-block; width: 100px; height: 80px; … Читать далее →

Рубрика: 免费网站脚本 | Оставить комментарий

CSS翻转块

Опубликовано 2019-03-28 автором stariс

最初的效果，吸引了访客的注意力，并没有破坏页面的外观 — 一个块移位器。 当您将鼠标光标悬停在它上面时将其转为。 试一试，将鼠标悬停在我的照片上。

Рубрика: 免费网站脚本 | Оставить комментарий

下拉框提示或其他信息

Опубликовано 2019-03-28 автором stariс

通常需要在页面上放置任何单词，短语或段落的提示或附加信息。 以明文形式执行此操作并不总是方便，因为文章的主要线程可能会丢失，因此在这种情况下，最好使用通过鼠标单击打开的隐藏文本。 点击的对象可以是文本的选定部分或“帮助”部分。 位于便利的位置。 附加信息将在单独段落中的文本的选定部分下打开，而所有其他内容将移动到底部，释放选项卡的空间。 П再次单击所选文本或按钮时，带有工具提示的选项卡将关闭。 例子： 1. 突出显示的文字. 文字-文字-文字-文字-文字 Справка 文字-文字-文字-文字-文字 文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字-文字   代码： Html <div class=»spravca»>文字-文字-文字-文字-文字-文字 <input type=»checkbox» id=»hd-1″ class=»reference»/> <label for=»hd-1″ >Справка</label> 文字-文字-文字-文字-文字-文字 <span class=»story»> 文字-文字-文字-文字-文字-文字 文字-文字-文字-文字-文字-文字 </span> <div> Css .reference { display: none; } .reference ~ … Читать далее →

Рубрика: 免费网站脚本 | Оставить комментарий

按钮CSS效果悬停并单击

Опубликовано 2019-03-27 автором stariс

这与设计无关。 这是一个现成的各种效果代码和详细的评论。 将来，这些效果可以应用于任何设计理念，并创建一个互联网上没有其他人拥有的原始按钮。 以下所示的所有按钮均有效。 选择您喜欢的选项。

Рубрика: 免费网站脚本 | Оставить комментарий

火红的标题

Опубликовано 2019-03-27 автором stariс

尊敬的网站管理员您好！ 在纯JavaScript上为您的网站另一个伟大的装饰. Пылающий заголовок 我在评论中指出的可用脚本设置。 HTML <div class=»flame» id=»fire»>Пылающий заголовок</div> CSS .flame { font-size: 30px; padding: 20px 0 10px 20px; width: 350px; font-weight: bold; background: scroll 0% 0% rgb(0, 0, 0); color: rgb(50, 50, 50); text-shadow: -1px 2px rgb(255, 255, … Читать далее →

Рубрика: 免费网站脚本 | Оставить комментарий

电子钟到网站

Опубликовано 2019-03-27 автором stariс

简单的工作电子时钟，可以轻松安装在任何网站上。 如果你尝试，在CSS的帮助下，你可以给他们一个时尚的网站设计外观。 我将给出一个非常短的CSS，以便你有自由创造。 要使时钟工作，您需要将属性onload =“digitalWatch（）”添加到body标签。 如果仅在单独的页面上需要时钟（例如，在此处），则将整个代码放置在body标签中。 如果站点的所有页面都需要时钟，脚本将放在head标签中，html将放在body标签中。 脚本： <script type=»text/javascript»> function digitalWatch() { var date = new Date(); var hours = date.getHours(); var minutes = date.getMinutes(); var seconds = date.getSeconds(); if (hours < 10) hours = "0" + hours; if … Читать далее →

Рубрика: 免费网站脚本 | Оставить комментарий