Атрибут width
Атрибутът width задава ширината на картинката,
която е зададена с тага
img.
В момента този атрибут е допустимо да се
използва само за картинки,
iframe,
video
и някои други тагове.
Допуска се да се указват стойности в пиксели или проценти. В случай на задаване на размер в проценти, те ще бъдат взети от ширината на родителя. В случай на задаване на размер в пиксели, мерните единици не се посочват.
Ако за картинката не е зададена нито ширина, нито височина - картинката ще има своя реален размер. Ако е зададена височина - картинката ще стане с зададената височина, а по ширина ще се настрои така, че нейните пропорции да не бъдат изкривени. Ако е зададена само ширина - аналогично, картинката ще се настрои по височина така, че да запази пропорциите. Ако са зададени и ширина, и височина - пропорциите на картинката могат да бъдат изкривени (а може и да не са, както познаете). Ако ширината или височината (или и двете заедно) са по-големи от реалните - картинката ще се увеличи, но ще загуби качество.
Препоръчва се да се задава ширина и височина на картинките в атрибутите - в този случай браузърът ще зарежда изображенията по-бързо - няма нужда да изчислява размера на всяка картинка след като я получи.
Не се препоръчва реалните размери
на картинката да се намаляват без необходимост. Например,
реален размер на картинката 1000 на 1000
пиксела, а вие й зададете ширина от 100px.
В този случай картинката на екрана ще изглежда
с 100 пиксела, но ще има размер
от цялата хиляда и съответно ще се зарежда
много по-бавно.
Примери за работа вижте тук:
таг img.