CSS Code Snippets

Useful CSS / CSS3 code snippets to style HTML elements, for page design, and Web Designers.

Animated Tooltip with HTML and CSS
- CSS code-snippet, example of an animated Tooltip made with HTML and CSS only.
Making Responsive IFRAMEs
- CSS code snippets for responsive iframe, both width and height. It works in desktop and mobile devices
Complex Shapes with a single DIV and CSS
- Complex Shapes with a single DIV and CSS properties, without image file
Heart shape with CSS
- Heart shape, created with a single DIV tag and CSS properties, without image
Yin-Yang with CSS
- Yin-Yang circle, created with a single DIV tag and CSS properties, without image
Egg shape with CSS
- Egg shape, created with a single DIV tag and CSS properties, without image
Clepsydra shape with CSS
- Clepsydra shape, created with a single DIV tag and a few CSS properties
TV-Screen shape with CSS
- TV-Screen shape, created only with a single DIV tag and a CSS properties
Diamond shape with CSS
- Two diamond shapes, simple created with a single DIV tag and CSS properties
Buttons with CSS
- Buttons created only with CSS, CSS3 properties, without using image file
Star shapes with CSS
- Star shapes, 5, 6, 8 and 12 points, created with a single DIV tag and CSS properties
Polygons with CSS
- Various Polygons shapes with CSS properties, Parallelogram, Pentagon, Hexagon, Octagon
Circle and Oval with CSS
- Circle and Oval shapes created with a single HTML DIV tag and CSS properties
Triangles with CSS
- Various Triangle shapes with CSS properties, triangle up, down, left, right
CSS Rhombus Shape
- CSS Rhombus Shape, create a rhombus with a DIV and CSS properties
CSS Trapezoid Shape
- CSS Trapezoid Shape, create a trapezoid with a DIV and CSS properties
Making DIV Contents Scroll Horizontally, with multiple Div`s inside
- Making DIV Contents Scroll Horizontally, with multiple Div`s inside. CSS code-snippets
Center Fixed and Absolute element
- How to center a fixed, or absolute HTML element, Div or other block element
Transparent Background, but not the text-content on it
- Transparent Background Color, and transparent image, with CSS, but not the text-content on it
Tabs effect with CSS
- Tabs effect with CSS. A single content divided into multiple sections, each associated with a header (or tab) in a list, that can be swapped to save s

Daily Test with Code Example

HTML

CSS

JavaScript

PHP-MySQL

Which type of <input> creates a color well control for selecting a color value?

type="text" type="color" type="date"

<input type="color" name="get_color" />

Which CSS method rotates the HTML element at a given degree?

scale() translate() rotate()

#some_id:hover {
  transform: rotate(60deg);
  -ms-transform: rotate(60deg);    /* IE 9 */
  -moz-transform: rotate(60deg);   /* Firefox */
}

Click on the function that returns the number with the highest value.

pow() min() max()

var maxn = Math.max(8, 4, 88, 56);
alert(maxn);      // 88

Which function prevent the same file from being included more than once in a page?

include() include_once() require()

include_once("some_file.php");

Last accessed pages

Courses Web: PHP-MySQL JavaScript Node.js Ajax HTML CSS ^(137798)
Get Mime Type of file or string content in PHP ⁽⁶⁰⁹⁵⁾
PHP OOP - Constructor Method ⁽⁷⁴³¹⁾
Ajax click Tracking - Monitor clicks on html elements ⁽²¹⁹⁶⁾
PHP-MySQL free course, online tutorials PHP MySQL code ^(68983)

Popular pages this month

Courses Web: PHP-MySQL JavaScript Node.js Ajax HTML CSS ⁽¹¹¹⁾
Read Excel file data in PHP - PhpExcelReader ⁽³⁵⁾
PHP Unzipper - Extract Zip, Rar Archives ⁽³¹⁾
The Mastery of Love ⁽²⁵⁾
SSEP - Site Search Engine PHP-Ajax ⁽²⁰⁾