Updated all our free & premium Drupal 9 themes to Drupal 10.

Email - info@zymphonies.com

HTML

SASS installation

SASS is an extension of CSS3, adding nested rules, variables, mixins, selector inheritance, and more. It's translated to well-formatted, standard CSS using the command line tool or a web-framework plugin

SASS Installation

First install ruby before installing SASS. SASS is built upon Ruby. If you are working on a MAC, chances are, you already have Ruby installed. If you may to install Ruby in Windows, use this Ruby Installer.

1) Install Ruby from http://rubyinstaller.org/

CSS triangle

Making a triangle with CSS is a great skill to have available to you, as it gives you one more way to call attention to an element on the screen. And let's face it, So let's take a look at how to get it done. Creating triangle with pure CSS can be a fun and exploratory process. Creating CSS triangles falls into that group as well. Even though that support for pure CSS triangles goes back to IE7, It's only with the introduction of CSS3 that we can really let it shine.

CSS3 media queries

Web developers can define a media type such as screen or print, and specify the look of the content by specifying conditions such as width, height, or orientation. A media query combines a media type and a condition to specify how web content will appear on a particular receiving device.

CSS3 Media Queries

HTML5 page structure

The HTML5 specification has added quite a few interesting and useful tags for structuring your markup. For a majority of everyday uses, these tags will replace many of our typical div entries from our code. more browsers are getting compatible with it and with the iPhone choosing this as it’s main multimedia language.

HTML5 Page Structure

HTML5 advantages

HTML5 has many new syntactical features, which include the <video>, <audio>, and <canvas> elements, as well as the integration of SVG content. Due to these new elements, it will be very easy to integrate multimedia and graphical content to web without using flash and third party plugins. There are also another new elements like <section>, <article>, <header> and <nav> which enrich the semantic value of the document.

HTML5 Advantages

Clearfix method

When a floated element is within a container box, that element does not automatically force the container’s height adjust to the floated element. When an element is floated, its parent no longer contains it because the float is removed from the flow. You can use 2 methods to fix clearfix & overflow: hidden

Clearfix Method

Example:

Subscribe to HTML