Google CSS3 STYLE GUIDES
We can follow the Google Style Guide to help make our web page look better and clean up our code to make it easier to read and format.
This section will help develop more effective style within your webpage.
This section will help develop more effective style within your webpage.
Images
We can review how to add images to our pages. To make the page look better, you will need to add some borders and colour. Google Style Guide recommends putting " " around the HTML attribute values, but ' ' around CSS properties.
Image Width and Height
We can use CSS properties to modify images instead of using HTML <img> tag attributes. There are actually two ways to set the size of an image: using the img tag attribute or using a CSS property.The following code sets the width using the img tag attribute:
Image Borders
We can learn how to add image borders using CSS. A border is added to an image by setting the border-style property to solid.Other border styles are: dotted, dashed, double, groove, ridge, inset, outset, and none.
The width of a border can be set with the border-width property.
The width of a border can be set with the border-width property.
Border Colour
We can change the color of image borders using CSS. The border color is set using the border-color property.To show a border you must set the border-style.
Simplified Code
We can write our CSS border properties in shorthand for simpler code. Like fonts, borders have a shorthand property.This property combines the values for border-style, border-width, and border-color into a single line of code.
