Ответы пользователя по тегу HTML
  • Видео по всей ширине?

    Responsive embeds из bootstrap вам в помощь: getbootstrap.com/components/#responsive-embed

    html:
    <!-- 16:9 aspect ratio -->
    <div class="embed-responsive embed-responsive-16by9">
      <iframe class="embed-responsive-item" src="..."></iframe>
    </div>
    
    <!-- 4:3 aspect ratio -->
    <div class="embed-responsive embed-responsive-4by3">
      <iframe class="embed-responsive-item" src="..."></iframe>
    </div>


    css:
    .embed-responsive {
      position: relative;
      display: block;
      height: 0;
      padding: 0;
      overflow: hidden;
    }
    
    .embed-responsive .embed-responsive-item,
    .embed-responsive iframe,
    .embed-responsive embed,
    .embed-responsive object,
    .embed-responsive video {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        height: 100%;
        width: 100%;
        border: 0;
    }
    
    /* Modifier class for 16:9 aspect ratio */
    .embed-responsive-16by9 {
      padding-bottom: 56.25%;
    }
    
    /* Modifier class for 4:3 aspect ratio  */
    .embed-responsive-4by3 {
      padding-bottom: 75%;
    }
    Ответ написан
    Комментировать
  • Open sans тонкий в photoshop но не в браузере. Что делать?

    1) Попробуйте добавить:
    -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;

    для body
    2) Подключите шрифты через Google fonts (до закрывающего тэга </head>):
    <link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300" rel="stylesheet">

    3) Нужно обязательно задать корректный font-family и font-weight: 300; для тех мест, где вам нужно отобразить шрифт:
    .cite {
      font-family: "Open Sans", Helvetica, Arial, Sans-sarif;
      font-weight: 300;
    }

    Можно это сделать глобально (для всего сайта), в том же body:
    body {
      font-family: "Open Sans", Helvetica, Arial, Sans-sarif;
      font-weight: 300;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }


    Откройте исходный код любого сайта с кастомными шрифтами (через веб инспектор/панель разработчика), посмотрите как сделано у них (можно посмотреть на том же тостере).
    Ответ написан
    Комментировать
  • Как сделать такой слайдер?

    Ответ написан
    Комментировать