Assignment 06, Website Development, CCV Spring 2017

Research



Question 1:

CSS text-transform Property

Example:

before

after

The text-transform property controls the capitalization of text. The CSS Syntax for this property are as follows:
text-transform: none|capitalize|uppercase|lowercase|initial|inherit
none does nothing, it is the default, and totally pointless as far as I can tell. capitalize transforms the first character of each word to uppercase. uppercase transforms all characters to uppercase. lowercase transforms all characters to lowercase. initial sets this property to its default value. inherit makes the element inherit this property from its parent element.

text-transform: CSS text-transform Property

CSS3 background-size Property

Example as seen in this div.

The background-size property specifies the size of the background images. The CSS Syntaxfor this property is as follows:
background-size: auto|length|cover|contain|initial|inherit
auto does nothing, it is the default, and leaves control of the background size up to the html or the image itself. length sets the width and height of the background image. The first value sets the width, the second value sets the height. If only one value is given, the second is set to "auto". percentage sets the width and height of the background image in percent of the parent element. The first value sets the width, the second value sets the height. If only one value is given, the second is set to "auto". cover scales the background image to be as large as possible so that the background area is completely covered by the background image. Some parts of the background image may not be in view within the background positioning area. contain scales the image to the largest size such that both its width and its height can fit inside the content area. initial sets the property to its default value. inherit makes the element inherit this property from its parent element. this property from its parent element.

background-size: CSS3 background-size Property

CSS3 border-_____-_____-radius Property

Example as seen in this div.

The border radius properties specify a rounded border on the element. Because there are 4 corners in an element, there are four variants of this property, as follows:
border-bottom-left-radius, border-bottom-right-radius, border-top-left-radius, border-top-right-radius
border-bottom-left-radius forms the bottom left corner, border-bottom-right-radius forms the bottom right corner, border-top-left-radius forms the top left corner, and border-top-right-radius forms the top right corner. This makes a rounded rectangle when used inside div tags.

border-bottom-left-radius, border-bottom-right-radius, border-top-left-radius, border-top-right-radius: CSS3 border-bottom-left-radius Property

CSS padding Property

Example as seen in the above two div areas.

The padding property adds a padding inside an element. This is used to move text or images, or any other element, over, down, up or otherwise inside another element. It has many uses, and can be used in many different css elements. It is one of the most useful and necessary properties in CSS, allowing you to add a margin to elements.

text-transform: CSS padding Property