🌍
English
Differences
This shows you the differences between two versions of the page.
|
user_documentation:faq:css_code [2012/05/03 19:29] flop25 [How To : save the changes in my Piwigo] |
user_documentation:faq:css_code [2015/06/02 12:55] (current) plg [How To : save the changes in my Piwigo] s/loose/lose/g |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | ====== How To Customize Colors (CSS coding)====== | + | ====== How To Customize Colors, Fonts and more (CSS coding)====== |
| + | |||
| + | <WRAP info 65% center round> For more details, see first: [[user_documentation:learn:customize]]</WRAP> | ||
| Line 5: | Line 7: | ||
| HTML (the Hypertext Markup Language) and CSS (Cascading Style Sheets) are two of the core technologies for building Web pages. HTML provides the structure of the page, CSS the (visual and aural) layout, for a variety of devices. | HTML (the Hypertext Markup Language) and CSS (Cascading Style Sheets) are two of the core technologies for building Web pages. HTML provides the structure of the page, CSS the (visual and aural) layout, for a variety of devices. | ||
| - | \\The CSS language (//Cascading Style Sheets//) is very useful to customize his gallery. Colors, fonts, positions of elements etc can be changed by using CSS. | + | |
| + | The CSS language (//Cascading Style Sheets//) is very useful to customize his gallery. Colors, fonts, positions of elements etc can be changed by using CSS. | ||
| <WRAP info 65% center round>__//**Some useful tutorials and websites to learn How To use CSS**//__ | <WRAP info 65% center round>__//**Some useful tutorials and websites to learn How To use CSS**//__ | ||
| + | * [[http://learn.shayhowe.com/html-css|A Beginner’s Guide to HTML & CSS ]] a new and very informative website for complete beginner. | ||
| * [[http://www.w3.org/standards/webdesign/htmlcss|W3C website]] The W3C is the consortium which defines the standards for Web Applications. It contains [[http://www.w3.org/2009/cheatsheet/|a cheat-sheet -a database of all CSS markups and HTML Elements-]], an [[http://jigsaw.w3.org/css-validator/validator.html.en|online validator]] and much more. | * [[http://www.w3.org/standards/webdesign/htmlcss|W3C website]] The W3C is the consortium which defines the standards for Web Applications. It contains [[http://www.w3.org/2009/cheatsheet/|a cheat-sheet -a database of all CSS markups and HTML Elements-]], an [[http://jigsaw.w3.org/css-validator/validator.html.en|online validator]] and much more. | ||
| * [[http://www.w3schools.com/css/|CSS School]] Interactive tutorials, very well done and **for absolute beginners. It's more than recommended to read those articles** : [[http://www.w3schools.com/css/css_intro.asp|Introduction]] [[http://www.w3schools.com/css/css_syntax.asp|Syntax]] and [[http://www.w3schools.com/css/css_id_class.asp|Id and Class]] | * [[http://www.w3schools.com/css/|CSS School]] Interactive tutorials, very well done and **for absolute beginners. It's more than recommended to read those articles** : [[http://www.w3schools.com/css/css_intro.asp|Introduction]] [[http://www.w3schools.com/css/css_syntax.asp|Syntax]] and [[http://www.w3schools.com/css/css_id_class.asp|Id and Class]] | ||
| Line 31: | Line 35: | ||
| <WRAP smaller centeralign> | <WRAP smaller centeralign> | ||
| - | {{:03-05-2012_20-37-49.jpg?direct |Fig.01 Firebug Menu}}\\ | + | {{::03-05-2012_20-37-49.jpg?direct |Fig.01 Firebug Menu}}\\ |
| //**Fig.01** Firebug Menu// | //**Fig.01** Firebug Menu// | ||
| </WRAP> | </WRAP> | ||
| Line 51: | Line 55: | ||
| > You have played with one of the tools previously mentioned, and you want to save your changes ?\\ | > You have played with one of the tools previously mentioned, and you want to save your changes ?\\ | ||
| - | You might have noticed that Firebug doesn't change the files : if you refresh the page, you will loose all your changes\\ | + | You might have noticed that Firebug doesn't change the files : if you refresh the page, you will lose all your changes\\ |
| - | <wrap important>If you follow that tutorial, you will NOT loose your changes during updates.</wrap> | + | <wrap important>If you follow that tutorial, you will NOT lose your changes during updates.</wrap> |
| Line 65: | Line 69: | ||
| <WRAP center round info 60%> | <WRAP center round info 60%> | ||
| - | If you need to add comments to remember what a code do, just add \// before your text and the line will not be interpreted. | + | If you need to add comments to remember what a code do, just add two slashes before your text and the line will not be interpreted. |
| Illustration :\\ | Illustration :\\ | ||