CSS The Complete Guide with Translation in All Languages
Intro Video
On this page you will read:
What is CSS?
The word CSS is derived from the phrase Cascading Style Sheets, which in Persian is called cascading style sheets, and it can be used to control the type of text, color and arrangement of writings, as well as other page components such as tables, images, etc. Did. In other words, HTML is responsible for determining the content of the page and CSS is responsible for determining how the content is displayed. The truth is that none of HTML and CSS alone have any particular advantage. With HTML alone, you can't design professional and eye-catching web pages. CSS alone cannot be used. HTML and CSS are side by side, which can provide tremendous power and design eye-catching and beautiful web pages.
CSS also enables you to set the display of your desired screen in several different modes, such as monitor mode, display mode at the time of printing, as well as to display on mobile browser pages correctly. Using this tool, you can also apply settings that display the desired web page depending on the size of the user's screen.
CSS is a style of notification that describes how a web page is displayed. In addition to HTML, other markup languages, including XHTML, XML, SVG, and XUL, support CSS.
Video Player
Why CSS?
Those who have experienced the design of web pages using tables know very well that implementing the desired layouts using tables is time consuming and somewhat difficult. At the same time, with the complexity of the page structure, the size of the generated XHTML codes increases, and in some cases, the exact control of the page components is out of the hands of the designer. This complexity confuses software that searches web pages for indexing search engines and is not able to perform indexing well. To overcome such problems, designing web pages using CSS today has the following advantages:
- The volume of code generated for page layout and therefore page volume is greatly reduced.
- In addition to making each web page lighter and clearer, and using standard visual and visual data, it has made web design much easier and has increased web access and performance.
- Page formatting is separate from layout and making changes to the page is easily possible.
- Search engines simply index website content, which improves website rankings in search engines.
CSS history
Like HTML, CSS was first born in the CERN series. It was on October 10, 1994, that Hakon Wium Lie, in collaboration with Tim Berners-Lee, broke the CSS debate. It was at this time that several other Style Sheet languages were introduced by other people, and the various debates that took place between the general public as well as the World Wide Web Consortium eventually led to the official launch of CSS in 1996. Be introduced.
CSS versions
CSS 1: The first version of CSS to be officially introduced to web developers by W3C was CSS 1. This version was officially made available to the public on December 17, 1996.
CSS 2: The second version of CSS was released in May 1998 and was released to users. In this version, new features such as Absolute, Relative and Fixed were considered. This version also created features such as creating understanding and recognizing different types of files (Media) and new capabilities for text design.
Version CSS2.1 has also been released, which fixes CSS2 errors and bugs. This version was suggested several times by the candidate W3C, which was postponed each time for further consideration. But it finally happened on December 7, 2010, and this version was suggested by W3C.
CSS3: Unlike previous versions, where all definitions and features were used in the form of a software, CSS3 has a modular structure. Each module adds special features to the software. This version of CSS was released in June 1999. Since CSS 3 was based on modules, by June 2012, more than fifty CSS modules, including Media Queries, Namespace, Selector Level, and Color, had been released by the team working on the language. In CSS3 you can use a variety of color formats such as HEX, RGB, RGBA and other non-conventional formats. All of these formats are well supported in CSS3.
CSS4: In September 2009, W3C began designing and completing the fourth version of CSS, although none of the popular browsers still support all of its features, but it is expected that in the near future this version of CSS as one Use the most common design tools with special features.
CSS has become much more complex since its release. Each version that has been released has added more capabilities to it. In the first version, you could do simple things like changing fonts, changing sentence alignments, changing background colors, and so on. As it gets more advanced, you can control almost every aspect of your HTML screen. Many HTML tags that were tasked with styling were removed from the language and assigned to CSS.
CSS structure
CSS has a simple syntactic language that uses English keywords to design and adjust page specifications. CSS includes a list of rules. Each rule consists of one or more selectors or Declaration blocks. Each of the notification blocks consists of a list of other variable notification blocks. Each variable notifier contains a clone (:) and a value. Also, if several variables are to be declared in a block, each of the variables is separated by a clone (;) toxin.
Types of CSS
There are three ways to write CSS:
Inline or embedded CSS: In this method, features and specifications are written in the relevant tag on the same HTML page:
<span style='text-align: center; margin:0 auto'></span>
Internal CSS: In this method, the features in the header or <head> section of the site are specified by writing the <style> tag:
<head>
<style type='text/css'>
Span {text-align:center; margin:0 auto;}
</style>
</head>
External CSS: The best way to write CSS. In this method, a page with the .css extension is created and a link is sent to it from the html page in the head section, and these two pages are linked together:
<head>
<link rel='stylesheet' type='text/css' href='style.css'/>
</head>
CSS frameworks
CSS frameworks are generally a package containing a set of folders and files created using standard base codes (including HTML, CSS, JavaScript, and the like). In short, using these frameworks, you will be provided with many standard and professional features that by spending a little time learning them, you will be able to design very powerful and beautiful web pages that will include professional elements that without these frameworks, days and You have to spend hours designing those elements. Some CSS frameworks include:
Bootstrap Tutorial : A framework consisting of HTML, CSS, and JS used to develop and design a responsive site. Due to the growing use of mobile phones and tablets, most people today are doing their activities, such as browsing websites using these tools. So it is very important that your site is displayed correctly on different pages so that the user does not have to use magnification to read the content or use the elements. That's why Responsive Site Design is used to build pages in different sizes, and the best technique and tool is the Bootstrap framework. The prototype of the design is faster with Bootstrap and is easily compatible with all browsers.
Foundation training : A front-end framework that has the right tools to design and build sites that fit mobile phones and screens of different sizes. The structure of this framework is based on HTML, CSS and jQuery, and although the main use of this framework is by HTML and CSS programmers, you can also use it in Sass and Rails-based projects.
- Semantic UI
- Metro UI
- Pure Css
- bulma
- cubes
- Materialize
- Skeleton
- Susy
- WIKit
Did you like this post?
