What is CSS ? CSS stands for Cascading Style Sheet. CSS is one of the programming code that aims to decorate and set the display style / layout of web pages so that more elegant and interesting. CSS is an internet technology that is recommended by the World Wide Web Consortium, or W3C in 1996. Initially, CSS developed in SGML in 1970, and continue to be developed until today. CSS has supported many markup languages such as HTML, XHTML, XML, SVG (Scalable Vector Graphics) and Mozilla XUL (XML User Interface Language).
In December 1996, the W3C CSS specifications introduced the Level 1 or also known CSS1 that supports the format, text font color, and others. Then, in May 1998, W3C published CSS2 in which regulated laying function elements. And now, W3C has been to improve and enhance ability to CSS3 CSS2.
CSS is used by web programmers and bloggers to determine the color, font layout, and all other aspects of presentation of the document on their site. Nowadays, almost no website built without css code.
As a blogger, you should also know what it is and how to use CSS to make it easier to design your blog. CSS code to make our readers to be comfortable and linger on our blog so we esteemed website page views increased. However, it all depends on how we use it so that it can attract visitors.
Also read the article about the difference http and https
CSS structure
- CSS command consists of two components, namely Selector & Declaration.
- Selector serves to tell the browser that the elements which CSS rule is applied.
- Selector can be any HTML element, class selector or selector id.
- Declaration is a CSS rule applied, consisting of properties and values.
Basic Introduction
Cascading Style Sheet consists of selectors, declarations, Property and Value. As in HTML, PHP and other programming languages, CSS also have a rule that writes itself.
Example css code:
Body {background-color: white;}
'Body' is the selector, '{}' is a declaration, 'background-color' is the property and 'white' is the value. The purpose of the above code is to set the background color (background color) of the tags 'Body' a web page.
HOW TO USE CSS
To exercise the use of CSS, the first step you should do is create a file using Software code editor such as Notepad, and then name the file in the format '.html'. Then practice the following ways. There are 3 ways to use CSS code on your site.
Elements, Tags, and Attributes
Before going further, we will look at three key terms to know when writing HTML. These three terms are the elements, tags, and attributes.Element
HTML element is a component that establishes the role of an object in a document, including the structure and content of the object. Example of an HTML element is p or b exemplified in the previous sections. Other popular elements in HTML for example a, h1, div, span, em, or strong.Tag
An element is usually represented by the tag. The opening tag indicates the element starts, and the closing tag marks the end of an element. The opening tag is represented by the name of the element that is flanked symbol "<>", for example . The closing tag is written by adding a forward slash ( "/") after the symbol "<". For example, the closing tag for the element a is .
Basic CSS
To be able to understand how to use CSS, we must first understand the three basic terms used in CSS, the selector, property, and value. The discussion on the meaning of these three terms will be made in the next section.
Selector
As the language used to give a stylish look, CSS uses a declarative method for specifying the HTML section you want to give the display style. Selection is done by specifying the HTML element selector.
Property
Value
Value is the value of the property we want to give. Values can be given alone vary, depending on the type of its property. For example, if you want to give a color value, we must provide value in #RRGGBB format (combination hex value of red-green-blue are commonly used in graphics processing programs like Photoshop).
Implement CSS in HTML
After the finished HTML is written, we can refer to an existing HTML CSS so that the design specified by the CSS can be applied to HTML. There are three ways to give CSS reference, namely:
References to External Files
We can provide a reference to a CSS file that is outside of HTML. How CSS references like these are often regarded as best practice in web development.Writing CSS in the Element Head
CSS who want to apply to an HTML document can also be written on the head of a document. Writing CSS like this is not recommended, because generally the elements contained in a document to be reused in other documents. Writing CSS directly on the head will cause the elements that must be written over and over again in other documents as well.CSS in the style attribute on the element
Jot CSS in the style attribute on HTML elements (attributes shared by all elements) is the last way, which is also not recommended for writing like this would "pollute" the HTML code. HTML created with the aim to provide semantic meaning to the content, not the design. Likewise, this method is usually used for manipulation style is done dynamically, through Javascript (which does not pollute the HTML code, because usually new attributes loaded after completion HTML is read by the browser).
Notice how each CSS affects the relevant elements in the image Comparison with CSS and HTML documents without CSS. Text on h1 elements turn red because of CSS that are at the top of the document, the paragraph has a very large text (50px) for the CSS file style.css, and the second paragraph (and only the second paragraph) in bold because CSS is in the style attribute in the second paragraph. These three separate CSS are going well.
What also needs to remember, the best way to reference the CSS is with reference to an external file. This method allows us to use only one CSS file for the entire web is developed. Design changes can also be done easily, just change one file only. Users also need to do a little download (for the whole file is in one place, and often the browser will use caching technology not to repeatedly download the same file). it is some notion of what it css?. may be useful for you
EmoticonEmoticon