主页 / 问题

问题[вёрстка]

Martin Hope
Алхимик
Asked: 2022-07-20 18:00:20 +0000 UTC
  • 0

大家好。我正在寻找一种方法，以便当您将鼠标悬停在一个单词上时，会出现一个带有小文本和图片的工具提示，并且当您单击时，会转换到维基百科上的页面。

我马上说我是第一次使用 HTML，我什么都不懂，所以如果这对你来说很明显，请抑制你的轻蔑并分享你的智慧）

在尝试在 Internet 上找到此代码时：

[data-tooltip] {
  position: relative; /* Относительное позиционирование */ 
}
[data-tooltip]::after {
  content: attr(data-tooltip); /* Выводим текст */
  position: absolute; /* Абсолютное позиционирование */
  width: 300px; /* Ширина подсказки */
  left: 0; top: 0; /* Положение подсказки */
  background: #3989c9; /* Синий цвет фона */
  color: #fff; /* Цвет текста */
  padding: 0.5em; /* Поля вокруг текста */
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); /* Параметры тени */
  pointer-events: none; /* Подсказка */
  opacity: 0; /* Подсказка невидима */
  transition: 1s; /* Время появления подсказки */
} 
[data-tooltip]:hover::after {
  opacity: 1; /* Показываем подсказку */
  top: 2em; /* Положение подсказки */
}
<p data-tooltip="Всплывающая подсказка сообщает о чём-то многозначном и полезном...">
  Наведи сюда курсор.</p>

如您所知，插入数据工具提示中图像的链接没有帮助）

html вёрстка
Martin Hope
Marie
Asked: 2022-08-23 01:00:33 +0000 UTC
  • 2

小伙伴们，你们好！请帮助橡胶布局：

我从移动版开始（您需要为移动设备、平板电脑和桌面版制作橡胶布局） - 我为手机制作布局，但出现问题是手机的块位于布局中一个在另一个之下，如在照片图中，在平板电脑和桌面 - 连续 - 我也画了，它们上的输入变成了徽标和配置文件按钮之间。我不明白如何实现它 - 或者读什么？谢谢！ 在此处输入图像描述

 <div class="header">
      <div class="header__section">
        <div class="header__item header__logo">
          <img src="img/logo.svg" alt="">
        </div>
        <div class="header__search">
          <input type="text" placeholder="Найти...">
        </div>
        <div class="header__item header__button-icon">
          <a href="#"><img src="img/profile-icon.svg" alt="profile-icon"></a>
        </div>
      </div>

    </div>

css вёрстка
Martin Hope
Павел Ромадов
Asked: 2022-08-13 13:09:51 +0000 UTC
  • -1

在此处输入图像描述

我欢迎大家！请告诉我如何自定义此进度条。我正在使用 swiper.js。使其在活动幻灯片上工作。现在，有了这个初始化，就出现了一条大实线。

 const bigSlider = new Swiper('.big-slider',{
        spaceBetween: 10,
        autoplay: {
            delay: 4000
        },
        loop: true,
        pagination: {
            el: '.swiper-pagination',
            type: 'progressbar',
        },
        
    })
вёрстка