In the hypertext markup language (HTML), a special command called "tag" is used to display an image on a page. This tag is referred to as img and contains a set of variables - "attributes". With the help of attributes, you can determine all aspects of the display of an image in a hypertext page, including its dimensions. However, this is not the only way to solve the problem - you can also reduce the size of the image using Cascading Style Sheets (CSS).
Instructions
Step 1
Place the height and width attributes in the tag responsible for displaying the desired image. Set the first one to the vertical size of the picture, and the second one horizontally. Set both numbers in pixels, but there is no need to indicate units - px - here. When calculating the necessary values for these attributes, pay attention to the observance of the proportions of the reduction of the picture, otherwise it will be displayed in a distorted form. For example, to put in a page a halved picture from a file called SomePic.jpg, the initial dimensions of which are 500 by 300 pixels, the tag can be done with the following command:
Step 2
You can set a proportional reduction of the original image dimensions in percent. To do this, use only the height attribute without specifying width, and add a percent sign after specifying the size defining number. For example, you can achieve the same effect as in the example from the previous step with a tag written in this form:
Step 3
If you want to specify the size of the image using style descriptions, use the same tag name - img - and the attributes - width and height. In this case, the units of measurement - px, pt or% - must always be specified. To specify a halving of the size of absolutely all images on the page, place the following entry in the style description block: img {height: 50%;} If you need to reduce the size of only one image, add an additional id attribute to its tag and assign it something unique for the images of this page value - for example, PicOne: Add the same value to the style record, separating it with a "hash" # from the tag name. The complete style description in this case may look like this: img # OnePic {height: 50%;}
