Image in HTML (Adding & manipulate)
To add an image into the page you need to use this syntax
HTML Images Syntax The HTML img tag is used to embed an image in a web page. Images are not technically inserted into a web page; images are linked to web pages. The img tag creates a holding space for the referenced image. The img tag is empty, it contains attributes only, and does not have a closing tag. The img tag has two required attributes: src - Specifies the path to the image alt - Specifies an alternate text for the image
You will also often see an image element use two other attributes that specify its size:height This specifies the height of the image in pixels.width This specifies the width of the image in pixels also you align the image and put it to the right or left
Now let’s talk about the extensions in iamges & the differance between them
There are 3 commonly used format for images & they represent around 95% of images on websites
JPEG & PNG & GIF and ther is a huge differences between them
JPEG is a lossy compression specification that takes advantage of human perception , JPEG images are best suited for photographs and paintings of natural scenes where the variations in colour and intensity are smooth. However, if an image contains text or lines, where a sharp contrast between adjacent pixels is desired to highlight the proper shape, this lossy compression technique does not yield good results.
PNG is a lossless image format No data is lost during compression and no compression artefacts are introduced in the image. For this reason, a PNG image would retain higher quality than an image than JPEG and would look a lot sharper, it would also occupy more space on the disk. This makes it unsuitable for storing or transferring high-resolution digital photographs but a great choice for images with text, logos and shapes with sharp edges.
GIF is also a lossless image format GIF images are now mainly used only if the image contains animations.
colors in CSS
Color can really bring your pages to life and make it attractive to the user such as the screen you are watching&
notify that we can change the color of the background and the text it self
<!DOCTYPE html>