Самый простой способ обрезать гифку (изображение в gif формате), это воспользоваться бесплатным редактором GIMP
Без долгих предисловий, приступим по шагам:
Открываем редактор GIMP и нашу gif-анимацию, как слой. Для этого в редакторе Выбираем File (1) и Open as Layers... (2)
Для того, чтобы посмотреть изображение в движении, нам нужно перейти по пути Filters - > Animation ->Playback
После того, как посмотрели и выбрали, то что нужно сохранить, а что обрезать, возвращаемся назад и выбираем : Tools -> Transform Tools -> Crop
Выделяем нужную область и делаем два щелчка левой кнопкой мышки. Вот и все. Для того, чтобы посмотреть что получилось, можно перейти к шагу 2
Теперь нам осталось только сохранить нашу гиф-анимацию в нужном формате. Идем в File -> Export as ...
называем наш файл (например - image.gif). Здесь очень важно указать расширение -.gif и нажимаем Export. В всплывающем окне отмечаем (галочкой), что сохранить нужно с сохранением анимации. Нажимаем Export.
Таким образом можно обрезать любое гиф-изображение, с сохранением анимации.
Думаю, что каждый сталкивался с вопросом - как на сайте сделать копирование части текста, текстовых полей или полей ввода-вывода -различных инпутов. Коль скоро есть определенные поля, из которых мы хотим сохранять содержимое в браузер, то возникает закономерное желание и очищать эти поля нажатием одной кнопки
Я хочу вам рассказать это на примере моего сервиса модификации ссылок для загрузки. Посмотреть его в работе и прочитать для чего он нужен вы сможете перейдя по ссылке.
Ничего нового. Обычные текстовые поля input с кнопками button и специфичными идентификаторами id, для привязки к нашему JS - коду.
Добавляем JS - код для копирования
<script>
var copyTextareaBtn = document.querySelector('.js-inputcopybtn');
copyTextareaBtn.addEventListener('click', function(event) {
var copyTextarea = document.querySelector('.js-copyinput');
copyTextarea.select();
try {
var successful = document.execCommand('copy');
var msg = successful ? 'successful' : 'unsuccessful';
alert('Copying text command was ' + msg);
} catch (err) {
alert('Oops, unable to copy');
}
});
</script>
Здесь, я думаю, что все понятно в коде и без пояснений. Берем поле с классом .js-copyinput и копируем его содержимое в браузер. Часть кода - try - catch добавлена для отображения процесса копирования пользователю. Я вывел уведомления в виде alert. Вы можете сделать это иначе или не показывать их вовсе. Но я думаю, что уведомления для пользователя нужны. Иначе не создается уверенности, что копирование информации в браузер прошло успешно.
JS - код для очистки полей.
Для того, чтобы нам очистить любое поле, нам достаточно просто написать в JS - коде, что значение этого поля равно пустой строке.
Например: document.getElementById('out').value = "";
Здесь мы говорим браузеру, что поле со значением out должно быть пустым.
Здесь, я не стал останавливаться на подключении функций. Думаю, что по этой теме информации сейчас предостаточно. Буду рад вашим отзывам и комментариям. В следующий раз я постараюсь остановиться на более интересных вещах.
Решил описать самый простой способ создания ссылки на загрузку файлов, папок, документов с Гугл-Диска сразу на компьютер пользователя.
Все началось с того, что я написал несколько полезных расширений для браузера Google Chrome и решил ими поделиться с друзьями, но не тут то было! Просто так сделать ссылку для скачивания со своего диска Google Drive не получилось. Дело в том, что Гугл Диск предоставляет по ссылке только просмотр файлов, мне же хотелось, чтобы при нажатии на ссылку "Скачать" - происходила загрузка файлов, а на ссылку "Просмотр" - можно было посмотреть файлы на диске до загрузки.
Многим это может показаться излишеством, но это достаточно распространенное требование владельцев сайта - предоставление прямой загрузки файлов на компьютер пользователя прямо с облачного хранилища.
Добавление атрибута download непосредственно к ссылке не принесло ожидаемого результата. Файлы загружались, но не в zip-архиве, или в существующем формате, а только как некое подобие html-документа.
Вот пример - создал папку на Диске, прошел -> "Включить доступ по ссылке" -> "Получить ссылку".
Для пробы я использовал Codepen. Здесь вы можете посмотреть, что получилось.
В принципе, на этом можно бы было и закончить этот пост. Потому что все что вам потребуется, это:
Получить ссылку на вашу папку (или документ) на Google Drive
Взять от нее (скопировать) идентификатор -id=///
Подставить в ссылку для загрузки (выделено красным)
Мне простые пути очень нравятся, но что делать, если ссылок много, или человек ну очень хочет разбираться во всем этом, ну и просто захотелось облегчить кому-то труд?
Решил написать простой скрипт, который бы производил все автоматически.
И пошло и поехало. Потому что захотелось, чтобы стояла кнопка - "Copy", при нажатии на которую сразу бы копировался код ссылки в браузер. Потом решил, что нужно поставить кнопку очистки поля ввода - Reset, которая бы облегчала задачу многократного ввода.
Ниже предлагаю воспользоваться модификатором ссылок для загрузки файлов с диска.
Код для модификации ссылки я применял очень простой:
function getLink(){
var custom = document.getElementById('in').value;
var output = document.getElementById('out');
var fl = custom.indexOf("id=");
console.log(fl);
var custPart = custom.substring(fl+3);
console.log(custPart);
var answer = "https://drive.google.com/uc?export=download&confirm=no_antivirus&id=" + custPart;
output.value = answer;
};
Понятное дело, что к этому коду требуется соответствующая html разметка.
Наверное каждый из нас когда-нибудь сталкивался с вопросом - как скачать фото формата WEBP из Гугл+.
Бывает, что выложил свои фото в соц.сети, и удалил с компа безвозвратно, а обратно скачать - никак. Много таких вопросов приходит и от блогеров, которые используют изображения из этой соц.сети у себя в блогах.
Поиск в гугле, нужных результатов не дал. На первых позициях онлайн конвертеры и программы для конвертации webp в jpg файлы.
Пожалуй, что это удобно, если этим пользоваться не часто, но я решил пойти другим путем и расскажу вам о самом простом способе скачать WEBP фото в jpg формате сразу на свой компьютер.
Для справки. Вот что нам говорит Википедия о данном WEBP формате.
WebP (произносится как англ. weppy[4]) — формат сжатия изображений с потерями и без потерь качества, предложенный компанией Google Inc. в 2010 году. Основан на алгоритме сжатия неподвижных изображений (ключевых кадров) из видеокодека VP8. Использует контейнер RIFF.
Для работы с данным форматом существуют открытые библиотека (libvpx) и конвертер (webpconv).
В общем - спасибо Гугл, ты, как всегда, меня порадовал своими обновлениями и улучшениями. :-)
На первых позициях поиска - онлайн конвертеры и программы для конвертацииwebp в jpg файлы.
Пожалуй, что это удобно, если этим пользоваться не часто, но я решил пойти другим путем и расскажу вам о самом простом способе скачать WEBP фото в jpg формате сразу на свой компьютер.
Не могу сейчас сказать точно, но на Mozila Firefox достаточно просто правой кнопкой мыши нажать на изображение и выбрать в меню пункт "Открыть изображение". После этого его можно скачать в приемлемом формате.
Самый простой способ
Для Google Chrome
Выбираем в ленте нужное фото, нажимаем на него правой кнопкой мыши и выбираем в выпадающем меню -"Открыть изображение в новой вкладке".
На фото ниже я это сделал и попробовал сохранить изображение. Не смотря на то, что в адресной строке браузера был указан путь к изображению и даже стояло расширение .jpg в конце строки, скачать его в формате jpg не удалось.
См фото ниже.
Нажимаем кнопку F12 (или открываем панель разработчика ->"Исследовать элемент" правой кнопкой мыши.
В открывшейся панели выбираем "Консоль" и вставляем в нее вот этот код:
function googlePlus(){
var url = document.querySelector('img').src;
var fL = url.indexOf("\/w");
var lL = url.indexOf("w\/");
var c = url.substring(lL+1);
var a = url.substring(0,fL);
location.href = a + c;
}
googlePlus();
Важно!!!
Если вы видите, что фото пытается сохраниться только как html страница ( расширение .html ), то код вот такой:
function googlePlus(){
var src = document.querySelector('img').src;
var firstLetter = src.indexOf("=");
var a = src.substring(0,firstLetter);
location.href = a;
}
googlePlus();;
Даже если вы попробуете первый вариант и ничего не получилось, то можете просто обновить страницу и смело запустить второй вариант кода. Код сохраняется только в открытой вкладке вашего браузера до обновления страницы.
Нажимаем Enter
Код в консоле может исчезнуть введенный вами код или там может появиться предупреждение( например такое - Resource interpreted as Document but transferred with MIME type image/jpeg ), в этом нет ничего страшного, просто это потому, что в этом окне загрузится выбранное вами изображение, но уже не в WEBP, а в jpg формате
Теперь просто кликаем по картинке правой кнопкой мышки и скачиваем ее в формате jpg
Если не получилось ни в одном из вариантов. то посмотрите внизу поста, под заголовком UPDATE.↓
Второй способ
Я не буду подробно на нем останавливаться. потому что вы и без меня его наверняка знаете.
Выбираем изображение и правым кликом в выпадающем меню, выбираем "Копировать картинку"
Открываем на компьютере любой удобный редактор изображений, мне для таких целей хватает и PowerPoint, можно GIMP или Photoshop
Сочетанием клавиш Ctrl + V вставляем изображение из браузера в пустой документ.
Обрезаем по формату и сохраняем, как обычное изображение, уже в любом доступном формате
Для ленивых!
Открываете фото в новой вкладке -> "Правая кнопка мыши" -> "Открыть фото в новой вкладке"
Вставить код и нажать Enter
function googlePlus(){
var src = document.querySelector('img').src;
var firstLetter = src.indexOf("/w530-");
var a = src.substring(0,firstLetter);
var b = src.substring(firstLetter + 15 );
var url = a + b;
var link = document.createElement( 'a');
link.target = "_blank";
link.download = "img.jpg";
link.href = url;
link.click ();
}
googlePlus();
Появится всплывающее окно загрузки, где вам предложат выбрать место сохранения и имя файла.
Если вы не знаете, как просто и легко скачать без дополнительных программ и расширений фото и видео из других сетей, то вы можете посмотреть их в моем блоге по этим ссылкам:
Как скачать видео с сайта Твиттер вы можете посмотреть в моем посте про blod-видео
UPDATE
В последнее время Google часто меняет свои алгоритмы и если не получилось скачать фото предложенным способом, то можно попробовать ввести в консоль вот такой код:
function googlePlusOdd(){
var src=document.querySelector('content .ZRciZe img').src;
var lastL = src.length - 13;
var a = src.substring(0, lastL );
location.href = a;
};
googlePlusOdd();
По нечетным дням он срабатывает :-)
Друзья, мне очень важно знать, получается ли у вас все так как у меня и есть ли какие-либо предложения, замечания, пожелания? Есть ли потребность в написании расширения для браузера? Загрузчики фото или видео и для каких сетей вы бы хотели иметь?
Чтобы позволить пользователю менять размер шрифта на вашем сайте или в блоге, можно воспользоваться вот таким простым,учебным кодом.
Главное, что стоит учесть это то, что размеры шрифта на вашем сайте должны быть заданы в относительных величинах (em, % ).
Здесь все очень просто. Код понятен, но постараюсь дать комментарии в тексте.
Каждая ссылка нашего блока имеет уникальный id, например - id="size-12". При клике на нее возниакет событие onclick, которое мы отслеживаем - document.getElementById('size-12').onclick = size12;
И так как функция присвоена переменной var size12 = makeSizer(12);, то мы запускаем функцию, передавая в нее уникальную переменную. В данном случае - 12.
Сама функция makeSizer(size) очень проста. Она возвратит document.body.style.fontSize = size + 'px';, в нашем случае - document.body.style.fontSize = '12px';, тем самым изменив размер шрифта всего документа. И коль скоро, у нас размеры заданы в относительных величинах, то пропорционально изменятся и заголовки документа.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
body {
font-family: Helvetica, Arial, sans-serif;
font-size: 12px;
}
h1 {
font-size: 1.5em;
}
h2 {
font-size: 1.2em;
}
</style>
</head>
<body>
<div>
<a href="#" id="size-12">12</a>
<a href="#" id="size-14">14</a>
<a href="#" id="size-16">16</a>
<a href="#" id="size-18">18</a>
<a href="#" id="size-20">20</a>
<a href="#" id="size-22">22</a>
<a href="#" id="size-24">24</a>
<a href="#" id="size-26">26</a>
</div>
<div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eaque iure aliquid perferendis assumenda necessitatibus dolorem aperiam inventore, est, consectetur ex? Quia, omnis illo dignissimos quas iusto cumque, culpa laboriosam laudantium.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio maxime consequatur necessitatibus, impedit sint repellendus esse? Architecto facere quibusdam nobis repellendus est a corrupti explicabo nemo. Nostrum architecto ullam maxime.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatibus velit eligendi quisquam harum ut perspiciatis illum quae vero, modi magni esse non vitae, quibusdam laudantium, a repellat adipisci sed </p>
</div>
<script>
window.onload=function (){
(function (){
function makeSizer(size) {
return function() {
document.body.style.fontSize = size + 'px';
};
};
var size12 = makeSizer(12);
var size14 = makeSizer(14);
var size16 = makeSizer(16);
var size18 = makeSizer(18);
var size20 = makeSizer(20);
var size22 = makeSizer(22);
var size24 = makeSizer(24);
var size26 = makeSizer(26);
document.getElementById('size-12').onclick = size12;
document.getElementById('size-14').onclick = size14;
document.getElementById('size-16').onclick = size16;
document.getElementById('size-18').onclick = size18;
document.getElementById('size-20').onclick = size20;
document.getElementById('size-22').onclick = size22;
document.getElementById('size-24').onclick = size24;
document.getElementById('size-26').onclick = size26;
})();
};
</script>
</body>
</html>
Наиболее частый вопрос с которым сталкиваются начинающие программисты, студенты и просто блогеры - как сделать заглавной первую букву в каждом слове текста с помощью java script.
Вопрос простой, но часто вызывает затруднения. В интернете много ответов - как сделать заглавной первую букву в слове, но не каждую первую в предложении. Поэтому я решил специально написать один пост, для того, чтобы раз и навсегда решить этот вопрос.
Пишу два метода. Первый - чистый JavaScript (без jQuery) и второй метод с jQuery.
Очень часто бывают такие вопросы от блогеров, на собеседованиях и вообще, знать это полезно.
Без долгих вступлений.
Вариант 1 - на чистом JavaScript
<body>
<div id="text">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eaque iure aliquid perferendis assumenda necessitatibus dolorem aperiam inventore, est, consectetur ex? Quia, omnis illo dignissimos quas iusto cumque, culpa laboriosam laudantium.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio maxime consequatur necessitatibus, impedit sint repellendus esse? Architecto facere quibusdam nobis repellendus est a corrupti explicabo nemo. Nostrum architecto ullam maxime.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatibus velit eligendi quisquam harum ut perspiciatis illum quae vero, modi magni esse non vitae, quibusdam laudantium, a repellat adipisci sed dicta.</p>
<button type="button" onclick=" UpperFirstLetter()">Click Me</button>
</div>
<script>
function UpperFirstLetter(){
var textArray = (document.getElementById('text').innerHTML).split(' ');
var UpperText = [];
for(var i = 0; i < textArray.length; i++){
var word = textArray[i][0].toUpperCase() + textArray[i].slice(1);
UpperText.push(word);
}
document.getElementById('text').innerHTML = UpperText.join(" ");
}
// UpperFirstLetter();
</script>
</body>
В этом примере мы обращаемся к части текста, которая заключена в блок сid = "text". Вы можете изменить это по собственному усмотрению, изменив первую строку скрипта var textArray = (document.getElementById('text').innerHTML).split(' ');
на другой "выборщик" - например на querySelector('здесь ваш класс или тэг').
Можете убрать кнопку. Сделать так, что функция будет запускаться сразу после загрузки документа и менять буквы.
Для этого вам стоит только добавитьUpperFirstLetter(); перед закрывающим тегом </script>(в коде выше - закомментировано // UpperFirstLetter();) и конечно же удалить кнопку button из html кода.
Без jQuery
Здесь код функции
window.onload = function () {
Здесь "запуск"
Например UpperFirstLetter();
};
Или так:
window.onload=function (){
(function (){
Здесь "Весь ваш код"
})();
};
Второй случай предпочтительнее, потому что полностью изолирует ваш код от исходного кода страницы. Не будет путаницы с именами переменных и функций.
В случае с jQuery код нужно поместить внутрь функции:
$(document).ready(function() {
Здесь ваш код с "запуском"
});
В этом примере первая функция будет делать заглавной только первую букву, а вторая, первую букву в каждом слове
<body>
<p>lorem ipsum dolor sit amet, consectetur adipisicing elit. odio maxime consequatur necessitatibus, impedit sint repellendus esse? architecto facere quibusdam nobis repellendus est a corrupti explicabo nemo. nostrum architecto ullam maxime.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatibus velit eligendi quisquam harum ut perspiciatis illum quae vero, modi magni esse non vitae, quibusdam laudantium, a repellat adipisci sed dicta.</p>
<button type="button" class="first">First Word Upper</button>
<button type="button" class="second">Each Word Upper</button>
<!-- jQuery -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
// Выводит первую заглавную букву
$("button.first").on("click", function(){
var firstLetter = $("p").text()[0].toUpperCase();
$("p").html(firstLetter + $("p").text().slice(1));
});
// Выводит заглавную букву у каждого слова
$("button.second").on("click", function(){
var names = $("p").text();
var arr = names.split(' '); //получаем массив из строки.
var result = []; // +
$.each(arr, function(i){
// добавляем заглавную букву каждому слову в массиве
var text = arr[i][0].toUpperCase()+arr[i].slice(1);
result.push(text); // +
});
$("p").html(result.join(" ")); // +
});
</script>
</body>
Внутри кода даны исчерпывающие комментарии. Вы так же можете изменить и этот вариант кода, как и первый, только не забывайте о том, что теперь вы можете сделать выборку с помощью jQuery. Например - $("button.second") - обращение к кнопке button с классом - second.
Скрипт можно разместить в отдельном файле, но подключить его в документе нужно ниже подключения jQuery.
Крауд-ссылки - виды, способы размещения Обучающий курс для начинающих сотрудников компании Link-Stream
Виды ссылок активная анкорная неактивная безанкорная ссылка, при нажатии на которую вы переходите на другой сайт ссылка, при нажатии на которую вы не переходите на другой сайт; ссылку нужно скопировать в строку браузера и только тогда вы попадаете на сайт ссылка, закрытая другой ссылкой или словом ссылка ничем не закрыта сверху посетите сайт https://links-stream.ru/ посетите сайт https://links-stream.ru/ посетите сайт Линк-Стрим посетите сайт https://links-stream.ru/
Параметры ссылок nofollow dofollow noindex редирект передают «вес» от форума сайту нашего клиента не передают «вес» от форума сайту нашего клиента не попадают в индекс поисковых систем промежуточная страница, которая забирает «вес» себе span
Что такое редирект и как его определить? пост со ссылкой на форуме промежуточная страница (редирект) сайт клиента Виды редиректа скрытый простой двойной тройной зашифрованный реферральный redirect redir go to forum/sitesite/forum
Как разместить ссылку ссылка-картинка безанкорная ссылка через ahref безанкорная ссылка через url анкорная ссылка через url анкорная ссылка через ahref [url=https://odmdetka.ru/]детские товары[/url] <a href=«https://odmdetka.ru/»>детские товары</a> [url=https://odmdetka.ru/][/url] <a href=«https://odmdetka.ru/»></a> [url=URL СТРАНИЦЫ][img]URL КАРТИНКИ[/img][/url] <a href=«URL СТРАНИЦЫ» ><img src=«URL картинки» ></a>
Как поставить ссылку через код сайта?
• находим любой пост любого пользователя с активной ссылкой на сайт
• наводим курсор на ссылку и нажимаем правой кнопкой, выбираем Посмотреть код
• копируем код ссылки, заменяем на свою ссылку и вставляем в свой комментарий
Как поставить ссылку на форуме, в котором отключены ВВ-коды?
• пробуем прокачать аккаунт
• отправляем сначала без ссылки, затем редактируем
• отправляем ссылку в подпись аккаунта
Модерация vs бан есть надежда нет надежды аккаунт сохраняется аккаунт блокируется сообщение может быть опубликовано сообщение может быть опубликовано ссылка может быть удалена ссылка чаще всего удаляется
Словарь терминов
• Ссылка -
1) так мы называем комментарий с активной ссылкой на сайт клиента;
2) уникальный адрес страницы сайта, при нажатии на который происходит переход на эту страницу
• Активная ссылка - ссылка, при нажатии на которую происходит переход на сайт
• Неактивная ссылка - ссылка, при нажатии на которую переход на сайт не произойдет (необходимо сначала скопировать ссылку в адресную строку браузера)
• Анкорная ссылка - ссылка, адрес которой закрывает другое слово
• Безанкорная ссылка - ссылка, адрес которой сверху ничего не перекрывает
• Атрибут ссылки - это ее параметры для поисковых систем
• Сайт-донор - сайт, на котором вы ставите ссылку (форум, блог и т.д), который передает вес другим сайтам
• Сайт-акцептор - сайт вашего заказчика, который получает «вес» донора
Словарь терминов
• Внешние (исходящие) ссылки - ссылки на форумах, которые ведут на сайт нашего клиента
• Внутренние (входящие) ссылки - ссылки на сайте нашего клиента, которые ведут на любые другие сайты (или на другие страницы)
• Редирект - промежуточная страница между форумом и сайтом клиента
• ВВ-коды - коды, которые используются а форуме для установления правил разметки, включения ссылок, добавления картинок/аудио/видео и т.п.
• Ссылка-картинка - картинка, при нажатии на которую вы попадете на сайт клиента
• Модерация - рассмотрение администрацией сайта вашего сообщения и принятие решения, размещать его на форуме или нет
• Бан - блокирование доступа аккаунта к форуму по причине нарушения его правил (например, размещение рекламных комментариев)
Допустим, что у нас есть папка проекта на нашем компьютере, в которой находятся файлы html, css, js и прочие. наша задача сделать некоторые изменения в наших файлах, сохранит их и разместить наш проект на GitHub
Переходим к папке проекта и нажимаем на нее правой кнопкой мыши. Вызываем Git Bash
В нем делаем инициализацию репозитория - git init
Добавляем наш проект в этот репозиторий (пока что все в Git)git add .
Делаем первый коммит git commit -m"Первый коммит"
Смотрим статус нашего проектаgit status
Все изменения на панели - здесь :
Теперь делаем изменения в нашем проекте. Например, мы добавим что-то в файл index.html
Проверяем статус нашего проекта git status Видим, что изменения есть в файле index.html (отмечены красным).
Делаем добавление наших файлов git add .
Делаем второй коммит git commit -m"Второй коммит"
Проверяем статус проекта git status - показывает что все чисто - см фото ниже :
Теперь что -то удалим из файла и что-то добавим. Это важно сделать, для того, чтобы потом можно было увидеть разницу в изменениях (удаление, добавление), когда мы выложим проект на GitHub
.
Повторяем все снова -пункты 7, 8, 9.
Теперь создаем пустой репозиторий на GitHub. Называем его - все равно как. Нас интересуют только две ссылки На фото ниже они отмечены красными стрелками. Они для каждого проекта свои и их нужно взять при создании репозитория.
Добавляем их по очереди нажимая клавишу Enter
Пришло время перейти в репозиторий и убедиться что все файлы добавлены. Там же мы можем увидеть и наши коммиты. Нажав на них мы сможем посмотреть, как изменялись наши файлы. Добавления - (+)выделены зеленым, а удаления красным (-)
Материалы по Git, которые могут быть вам интересны:
Хотите освоить самые современные методы написания React приложений? Надоели простые проекты? Нужны курсы, книги, руководства, индивидуальные занятия по React и не только? Хотите стать разработчиком полного цикла, освоить стек MERN, или вы только начинаете свой путь в программировании, и не знаете с чего начать, то пишите через форму связи, подписывайтесь на мой канал в Телеге, вступайте в группу на Facebook.Пишите мне - kolesnikovy70 почта gmail.com
Удачного кодирования!
Телеграм канал - Full Stack JavaScript Developer
Помочь проекту (любая валюта).
DONATE
Абсолютные и относительные ссылки. Как указать путь к файлу правильно
Абсолютные ссылки всегда начинаются с имени протокола. Например http:// и содержат имя файла.
Относительные - ведут отсчет от корня сайта или текущего документа.
При обращении к каталогу без явного указания названия файла (то, что пишется в конце, после /fail.html) обычно открывается индексный файл - index.html. Это стоит помнить, чтобы всегда вы могли защитить свой сайт от мошенников. Об этом я рассказываю в настройках WP.
Абсолютные ссылки обычно применяются для указания документа на другом сетевом ресурсе, впрочем, допустимо делать абсолютные ссылки и внутри текущего сайта. Однако подобное практикуется нечасто, поскольку такие ссылки достаточно длинные и громоздкие. Поэтому внутри сайта преимущественно используются относительные ссылки.
Если вы забыли как правильно написать ссылку в коде, то следует вернуться к этому посту.
Рассмотрим создание относительных ссылок более подробно.
Вариант 1 Фалы располагаются в одной папке?
Здесь все просто. Нужно сделать ссылку из исходного на ссылаемый. То есть вот так:
Как видите, ничего трудного нет в этом, если знать, как правильно обозначить путь к файлу.
Хочется предупредить, что этот метод указания пути к файлу не работает на локальном компьютере и годится, только для серверов.
Зато на компьютере вообще все проще простого.
Сейчас я вам расскажу пару фишек о том, как легко и точно прописать путь к файлу.
Вариант первый.
Выбираете нужный вам файл
Зажмите кнопку Shift и щелкаете правой кнопкой мыши.
В открывшемся меню выбираете копировать путь к файлу.
Вставляете сразу после = без кавычек. Они подставятся автоматически.
Если вы пользуетесь командной строкой на компьютере. Лично у меня она даже закреплена в панели задач. То..
Вариант второй.
Открываете командную строку
Просто перетаскиваете туда нужный файл
Получаете точный путь к вашему файлу. Копируйте и наслаждайтесь!
На этом все на сегодня. Хочется добавить. что при создании папок и файлов не стоит пользоваться кириллицей и тем более пробелом, или разными регистрами символов.
Пробуйте, экспериментируйте и делитесь своими "фишками" и "кейсами".
Хотите освоить самые современные методы написания React приложений? Надоели простые проекты? Нужны курсы, книги, руководства, индивидуальные занятия по React и не только? Хотите стать разработчиком полного цикла, освоить стек MERN, или вы только начинаете свой путь в программировании, и не знаете с чего начать, то пишите через форму связи, подписывайтесь на мой канал в Телеге, вступайте в группу на Facebook.
Хотите освоить самые современные методы написания React приложений? Надоели простые проекты? Нужны курсы, книги, руководства, индивидуальные занятия по React и не только? Хотите стать разработчиком полного цикла, освоить стек MERN, или вы только начинаете свой путь в программировании, и не знаете с чего начать, то пишите через форму связи, подписывайтесь на мой канал в Телеге, вступайте в группу на Facebook.Пишите мне - kolesnikovy70 почта gmail.com
