Guidance from 456 Berea Street, Use the label element to make your HTML forms accessible:

All visible form controls except buttons should have an associated label element (buttons are self-labelling). The label element can be associated with its form control either implicitly or explicitly.

An implicit association is created by putting the form control inside the label element, while an explicit association is created by giving the label element a for attribute with the same value as the form control’s id attribute.

The height and width attributes of the element should match the pixel dimensions of the graphic, or the graphic should be resized to match the height and width set in the HTML. If a graphic is bigger than the assigned image attributes, you’re showing the user less than they are downloading. If the graphic is smaller than what is assigned, then the image will scale up and look pixelated. In any case, when web browsers resize images, it does not look ideal.

While you may have a good reason to write styles inline using the “style” attribute, generally it is not a good practice. In this case styles are not reusable, too specific, and the code becomes bloated and difficult to maintain. We suggest identifying common styles and including them with a style sheet.