The area “Quotation Prevents and Textual content Boxes” in Part 4 talks about how to use the cushioning and edge qualities to add empty place within and around an element’s region. Those same qualities edge and cushioning can also be used to pictures to specify the place around an picture on one, two, three, or all four factors.
For example, think you desired to add a little prevent of place on the eventually left part of an picture, but you do not want to add any place on the right part because that part suits completely with another picture. If you included the edge eventually left home to your design piece or within your img tag, you could add place only on the eventually left part.
<img src="photo.jpg" width="200" height="200" style="margin-left: 25px;" />
Centering
By this point there can be probably a big question still staying about pictures and positioning . . . how to center?! While there is not a “center” property for pictures, there is a technique you can use to middle an picture on the page or within a section. The key can be found in changing the way we refer to “centering” a component in reality what we’re doing is making its eventually left and right sides exactly equal.
First, we must tell the technique to display the picture as a prevent factor. In CSS, prevent elements will instantly fill the entire available space. So if an picture becomes a prevent factor, its sides will grow until they reach the sides of the technique window.
Next, if you tell the technique to make both the eventually left and right sides the same, you will, in effect, middle the picture. The following is an example of the code you might use to middle an picture. First, the style sheet:
Then, add the name of the category (in this case it’s “centered”) to the img tag. Determine reveals the outcome in the technique.
No matter how wide (or narrow) the technique window is opened, the image remains centered side.
<img src="art-turtle.gif" alt="Drawing of a Turtle" class="centered" />
0 comments:
Post a Comment