Есть ли более простой способ HTML-пути, чем повторение ./?

Question

Действительно основной вопрос, некоторые советы были бы здорово пожалуйста. Все мои веб-изображения и CSS, конечно, организованы в моем корне. Затем у меня есть папка каталога, которая разворачивается на 3-4 глубинные подкатегории. В моем HTML ее становится немного неаккуратна поиск моих изображений/CSS, потому что я использую много:

../

<img src="../../../images/myimage.png" style="width:200px; height:auto;"> 

Что вы, ребята, рекомендую? Вы это делаете? Или я должен сортировать мои изображения, относящиеся к этому файлу, в свои подкатегории? Спасибо, как всегда.

C: \ Users \ SaM \ Desktop \ Webroot \ каталог \ folder1 \ folder2 \ folder3

Answer 1

Вы можете использовать base для этого см MDN

HTML-элемент определяет базовый URL, используемый для всех относительных URL-адресов, содержащихся в документе. В документе может быть только один элемент.

Например, если ваша структура папок как ваш_домен/набор изображений <base href="yourdomain"/>

Answer 2

Это правильный способ сделать это. Вместо сортировки изображений в соответствующей папке вы можете сохранить их в отдельной папке только так, как вы.

Существует способ не минимизации этого нет времен ../

Не назначайте src непосредственно в строке тега. Всегда предпочитайте отдельный файл css или файл javascript, чтобы сделать это. Вы можете поместить все ваши файлы css в одну папку, и вы можете сохранить эту папку ближе к своей папке images.

Чтобы вы могли использовать только один ../. это будет выглядеть как ../images/yourimage.png

Пусть местоположение вашего HTML файла, как \1\2\3\4\5\6\7\8\sample.html

И ваши файлы изображений в \1\images\ вы можете поместить все javascript файлы в папке, которая ближе к images папке, как это \1\scripts\

Теперь предположим, что в файле sample.html было много тегов изображений как ниже

<img height="200" width="200" class="nature"/> 
<img height="200" width="200" class="nature"/> 
<img height="200" width="200" class="nature"/> 

вы можете просто импортировать javascript файл как этот

<script src="../../../../../../../../scripts/myscripts.js"></script> 

Примечание: это единственное место, где вы собираетесь использовать длительные ../

В myscripts.js файле вы можете просто использовать

$(".nature").attr("src","../images/yourimage.png"); 

Аналогичным образом вы можете сделать это и для остальных тегов. Итак, в этом `javascript вам не нужно использовать длинные места.

Возможно, у вас есть 100 из img тегов. вы можете просто импортировать этот файл js только один раз и использовать его.