Вставить картинку в поле вкладки

[kristinad]

Здравствуйте. Есть блок с вкладками, а именно - раскрывающиеся вкладки типа Аккордеон. Необходимо вставить картинку в названии каждой вкладки перед текстом. Как это сделать при помощи кода html?

1210517849_1.png.83796340d58e4e4836d7f158fd387711.png

<div class="mbr-overlay" mbr-if="overlay&&bg.type!== 'color'" mbr-style="{'opacity': overlayOpacity, 'background-color': overlayColor}">
    </div>
        <div class="container">
            <div class="media-container-row">
                <div class="col-12 col-md-12">
                    <div class="section-head text-center space30">
                       <h2 class="mbr-section-title pb-3 mbr-fonts-style" mbr-theme-style="display-2" mbr-if="showTitle">
                            Accordions
                        </h2>
                    </div>
                    <div class="clearfix"></div>
                    <div id="bootstrap-toggle" class="toggle-panel accordionStyles tab-content">
                        <div class="card">
                            <div class="card-header" role="tab" id="headingOne">
                                <a role="button" class="collapsed panel-title" data-toggle="collapse" data-core href="#collapse1" aria-expanded="false" aria-controls="collapse1">
                                    <h4 class="mbr-fonts-style" mbr-theme-style="display-4">Fashion Trends</h4>
                                </a>
                            </div>
                            <div id="collapse1" class="panel-collapse noScroll collapse" role="tabpanel" aria-labelledby="headingOne">
                                <div class="panel-body">
                                    <p class="mbr-fonts-style mbr-text panel-text" mbr-theme-style="display-4" data-app-selector=".panel-text">
                                       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris et elit vitae lectus convallis scelerisque. Cras vestibulum blandit lorem, at fringilla nisl sollicitudin ac. Nunc venenatis nec neque sed semper. Mauris viverra, sapien sed fringilla egestas, sem felis condimentum augue, vitae sodales sem metus in ex. Aenean massa velit, sollicitudin quis elementum sit amet, vehicula sed nunc.</p>
                                </div>
                            </div>
                        </div>
                        <div class="card" mbr-if="bootstrapAccordion > 1">
                            <div class="card-header" role="tab" id="headingTwo">
                                <a role="button" class="collapsed panel-title" data-toggle="collapse" data-core href="#collapse2" aria-expanded="false" aria-controls="collapse2">
                                    <h4 class="mbr-fonts-style" mbr-theme-style="display-4">Casual Style</h4>
                                </a>
 
                            </div>
                            <div id="collapse2" class="panel-collapse noScroll collapse" role="tabpanel" aria-labelledby="headingTwo">
                                <div class="panel-body">
                                    <p class="mbr-fonts-style mbr-text panel-text" mbr-theme-style="display-4" data-app-selector=".panel-text">
                                       Donec facilisis felis arcu, vitae vestibulum massa lobortis eget. Ut pellentesque purus feugiat, tristique magna ac, luctus est. Vivamus sit amet magna venenatis, bibendum erat eu, tincidunt justo. Aenean viverra sollicitudin neque, sed bibendum nulla mollis id. Proin sit amet aliquet dui.&nbsp;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris et elit vitae lectus convallis scelerisque.</p>
                                </div>
                            </div>
                        </div>

[maks1331]

http://htmlbook.ru/samhtml5/formy/zagruzka-failov например вот.

А дальше что хотите от картинки? Просто загрузить? Тогда верхняя ссылка должна навести вас на мысль. А если вы хотите её потом, например, отправить письмом или сохранить на сервере - тут одним html вы обойтись не сможете и придется разбираться с js/php

[kristinad]

Сообщение от maks1331

http://htmlbook.ru/samhtml5/formy/zagruzka-failov например вот.

А дальше что хотите от картинки? Просто загрузить? Тогда верхняя ссылка должна навести вас на мысль. А если вы хотите её потом, например, отправить письмом или сохранить на сервере - тут одним html вы обойтись не сможете и придется разбираться с js/php

Мне не нужно ее никуда загружать и отправлять. Она просто как элемент графики должна отображаться рядом с текстом.

[maks1331]

Сообщение от kristinad

Мне не нужно ее никуда загружать и отправлять. Она просто как элемент графики должна отображаться рядом с текстом.

Насколько я помню, для её отображения на странице, после загрузки её нужно обработать java script`ом и только после этого отобразить

[ADSoft]

может так

<div class="card-header" role="tab" id="headingOne">
<img src="img.png" />
                                <a role="button" class="collapsed panel-title" data-toggle="collapse" data-core href="#collapse1" aria-expanded="false" aria-controls="collapse1">
                                    <h4 class="mbr-fonts-style" mbr-theme-style="display-4">Fashion Trends</h4>
                                </a>
                            </div>

[maks1331]

Сообщение от ADSoft

может так

Прочитал ваш ответ и посмеялся над своим, я почему то даже не подумал, что речь идет о такой банальной штуке, как вставка картинки через html