Как добавить изображение заголовка в ящик в Интернете с помощью Google Material Components? - PullRequest
Новая
       23

Как добавить изображение заголовка в ящик в Интернете с помощью Google Material Components?

0 голосов
/ 03 июня 2018

Я создаю веб-сайт с Google Material Components для веб-сайтов.Я добавил ящик на свой веб-сайт и хочу добавить изображение заголовка, но я не знаю, как это сделать.Вот раздел ящиков на веб-сайте Material Design:

https://material.io/develop/web/components/drawers/

1 Ответ

0 голосов
/ 30 ноября 2018

До сих пор нет официального пути для достижения этой цели.Самый простой способ: сначала

обернуть заголовки заголовков (не считая тега img), 

<div class="mdc-drawer__header">
    <img id="header-image" src="img.jpg">
    <div id="titles-wrapper">
        <h3 class="mdc-drawer__title">Title</h3>
        <h6 class="mdc-drawer__subtitle">Subtitle</h6>
    </div>
<div>

second, в файле CSS или в теге style,

#header-image, #titles-wrapper {
    display: inline-block;
    vertical-align: middle;
}

#header-image {
    width: 32.5%;
}

#titles-wrapper {
    width: 66.5%;
}

Примечание: Нет необходимости устанавливать ширину изображения 32,5%, но крайне важно иметь допуск 2% на общую ширину.30% и 68% будут работать.

...