Google Sites CSS (Inline CSS)

Google Sites CSS


The 3 Main Type of CSS Cascading Style Sheets


Inline CSS

Inline CSS is an attribute of an Object Tag using
Style=""

Embedded CSS

Grouped in a HTML Document in the Header or Body with
<style type="text/css"></style> 
which can be used in Google Sites and Google Sites HTML box.

External CSS


External CSS references a file File.css to set the style of the HTML content , which is not Fully Available in Google Sites.

 Manage Site > Colors and Fonts will allow some site wide CSS modifications.



Inline CSS Example

Using Inline CSS you can apply style sheet formatting to content Text and Images.


Custom CSS Example

Custom CSS Example using the Style Attribute
<div style="color:blue;background-color:white">Google Sites CSS</div>

Custom CSS (Style Attribute) Result

Google Sites CSS



CSS Values


The CSS value is converted in Google Sites to Hex or rgb (red green blue) values.


Custom CSS Color Formats


Hex

style="background-color:#ffffff"

RGB

style="background-color:rgb(250,250,250)"

RGBA

An Additional Alpha Channel for Opacity

style="background-color:rgb(250,250,250, 0.5)"


The Values for basic CSS , can also be customized directly by selecting text in Google Sites internal WYSIWYG editor. WYSIWYG editor - Text Color


Customize your content Styles within Google Sites CSS. In Google sites you need to use the <object> tag to embed your styles or the HTML Box.

HTML Box 


You can also use the HTML Box to create more advanced HTML , JavaScript , CSS Styles , and control with JavaScript and jQuery.