Графика и изображения в HTML, «IMG» маркер за вмъкване на изображения и атрибути за тяхната регистрация
Този човек е известно само,
че той не е в затвора, но защо не седнете - не е известно.
Марк Твен.
T си е урок за това как да вмъкнете картинка в HTML. как да го организира, как да се направи текст поток около изображения и т.н. Известно е, че изображенията направят сайта още по-привлекателен и различен от другите ресурси, така че възможността за използване на маркера и неговите атрибути са много полезни в днешния Интернет. Но най-важното тук - чувство за мярка!
P ereizbytok графики ще доведат за претегляне, HTML-страници и, съответно, ще се увеличи времето си натоварване. В допълнение, наличието на голям брой снимки ще отвлече вниманието на посетителя от основното съдържание на сайта (разбира се, ако графикът не е основното съдържание на сайта). Така че, когато да се спре и да използва изображенията в HTML кода, само когато това е необходимо. А ще имате и щастие!
В урока за атрибутите на тялото маркер, вече говорихме за това как можете да използвате снимка като HTML-документ фон. Сега нека да поговорим за графиките, използвани в "горния слой» HTML-страници.
§ 1. Как да вмъкнете картинка
L За да вмъкнете картинка в маркера HTML IMG се използва с задължителен атрибут на SRC. Този атрибут казва пътя на браузъра, за да графичен файл. Т.е. да вмъкнете картина с logo.jpg име на определено място на страницата (толкова дълго, колкото на страницата, и картината се намира в същата папка (директория)) трябва да бъде на това място, поставете следния HTML-кода:
Аз е образ и страница са разположени в различни директории (папки), трябва да укажете пътя до изображението по отношение на страницата. Например, ако на HTML страница е в (папка) сайта на директория, е поддиректория (папка) изображения, и в която е наш образ logo.jpg, а след това я поставете в същата директория (папка), което трябва да напишете:
В последния случай, браузърът ще покаже кода, както следва:
P omimo задължителен атрибут SRC в тага IMG има няколко допълнителни атрибути. Нека ги разгледаме по-подробно.
§ 2. Размери Images
Н achnom с атрибути, които ви позволяват да определите размера на изображението (или по-скоро, за трасиране на място в размера на страниците). Ето кои са те:
E Ако използвате тези атрибути, браузърът първо ще отпусне място в графика, подготовка на формата на документа се покаже текста и едва след това да се зареди изображението. В същото време, той постави на изображението в избрания размер на правоъгълника, дори и ако действителният ширината и височината на изображението по-големи (компрес) или по-малко (участък). В случай, че тези атрибути не са използвани, браузърът ще се зареди изображението веднъж, а на изхода става за нея текст и други елементи се забави.
Ирен W, и височина на изображението може да бъде определен в пиксели (с размерите на картината ще бъде постоянна, независимо от разделителната способност на екрана), и като процент (размер на картината, ще зависи от разделителната способност на екрана на потребителя). Например:
§ 3. Алтернативен текст
Ако потребителят в настройките на браузъра, за да забраните на изображението, е възможно вместо на алтернативен текст дисплей картина, която би обяснило, че трябва да има изостават от графика. Това се постига чрез прилагане на ALT атрибута.
В този случай, браузърът ще запази място на страницата за снимката, но вместо това от снимките показват текста, който пиша в стойността на ALT атрибут:
P за повторно, това ще се случи, ако потребителят е избрал графика. Ако не е, картината ще се скрие алтернативен текст.
§ 4. Необходимо е хармонизиране на изображения
С познатия подравняването атрибут можете да контролирате подравняването на изображения във връзка с други елементи на HTML-страници. В подравняване атрибут има няколко стойности, но ние сме най-голям интерес в момента две:N Например, HTML-код
браузърът ще покаже пътя
Тя ще изглежда така:
D За да спрете опаковане на текстови изображения могат да бъдат използвани BR маркер (познат от предишния раздел за форматиране на текста в HTML). Ние имаме ясна BR етикет атрибут. което може да отнеме три стойности:
§ 5. Създаване на подложка около снимки
P повторно подразбиране, изображенията са вградени в страницата много близо до текста и другите елементи. Ако този дисплей не е изпълнено, тогава можете да зададете полетата около изображението. Това се прави с помощта на следния маркер атрибути IMG:
Н Стойностите на тези атрибути е определено в пиксели. Например, ако имаме малко добавка предишния пример:
получаваме следното:
Със същото е и с начина, по който цялата "състав" изглежда преди (по-горе).
§ 6. рамката около изображението
Областта на снимки може да създаде черна рамка с помощта на граничния атрибут. Стойността на този атрибут е посочено в пиксели и определя дебелината на рамката. Например, HTML-код:
браузърът изглежда така:
§ 7. Заключение
H и този раздел на HTML таговете. които са необходими, за да вмъкнете снимки на страниците на сайта е завършена. В следващия раздел ще говорим за това как да се създават връзки, и как да свържете картина в HTML.
Споделете тази страница: