CSS Tutorial - Lesson 2 - Getting Started with CSS. CSS properties background, color.
Hello, everyone. In the previous lesson, I created two files: an HTML file and a CSS file. Here's their code:
index.html:
<html> <head> <title>CSS Tutorial</title> <link type="text/css" rel="stylesheet" media="all" href="style.css" /> </head> <body> <p>Learn CSS with drupalbook.org</p> <p>2nd line: Learn CSS with drupalbook.org</p> </body> </html>
style.css:
CSS Tutorial - Lesson 3 - Properties background-color, font-style, font-weight, text-align, text-decoration, text-transform.
Over time, many HTML tags have been created, but with the widespread adoption of CSS, some of them should be avoided—such as <font>, <b>, <i>, and <center>. We’ll look at other “deprecated” tags later. These CSS properties will help you reduce unnecessary code in your HTML and move styling into CSS files.
In the previous lesson, we explored how to add CSS properties and choose colors. In this lesson, we’ll look at some common formatting features that you may have seen in HTML before—but now we’ll do it the proper way using CSS.
CSS Tutorial - Lesson 4 - The display property. Difference between div and span.
In previous lessons, we connected CSS via a file and wrote a bit of CSS code to see how it works. In this lesson, we’ll explore an important property: display. The display property determines how an HTML element is rendered in the document—whether it will be displayed inline like text or as a block that has its own width and height. Let's start with the basics: how tags are displayed by default. For example, a <div> is displayed as a block, while a <span> is inline like text. Let's begin with how text is displayed.
CSS Tutorial - Lesson Conclusion - From HTML/CSS to Drupal
This concludes the CSS tutorial, but not your journey in learning CSS. I suggest moving on to practice and continue studying CSS by creating a Drupal theme. I’ll find a PSD mockup online, and we’ll convert it into a Drupal theme based on the Zen theme.
You can also proceed to learning PHP:
Javascript Lessons (textbook, self-study guide)
JavaScript is one of the most popular programming languages in the world. While it may be losing some of its dominance over time, many developers still prioritize learning it.
You will need JavaScript to later study jQuery, which is itself a JavaScript framework. So before diving into jQuery, it's important to understand the basics of JavaScript.
JavaScript code is embedded directly into an HTML page using the <script></script> tags:
Javascript Lesson 1 Variables and Operations on Them
I won't beat around the bush describing every variable type and operation—we don't need that. Our main goal is to grasp the basic syntax of JavaScript, then move on to learning jQuery, and from there you’ll be able to expand your JavaScript knowledge on your own. If you're more interested in studying JavaScript in-depth and don't care for working with this amazing framework, you should probably find a more comprehensive JavaScript textbook. But if you want to build sites in Drupal and learn jQuery afterward, then we're on the same path. So let's get started.
Javascript lesson 2 The if construct
In this lesson, we will explore how the if statement can be used in JavaScript. The syntax in JavaScript is quite similar to PHP (both were designed with C++ programmers in mind), so you can also read about if statements in this PHP lesson:
Javascript Lesson 3 While, For Loops
In this lesson, we will go over loops in JavaScript. As I mentioned earlier, the syntax of the PHP language is similar to JavaScript, so you can also take a look at loops in PHP:
PHP Lessons – Lesson 12 – Loops while, foreach, for
With one exception: JavaScript does not have a foreach() loop. Instead, we will use the each()
method in jQuery to iterate over elements in the future.
Javascript lesson 4 Functions
In this lesson, we will look at functions in JavaScript—how to write them and what kinds of functions exist. You can read about functions in these PHP lessons; all the examples will also work in JavaScript:
PHP Lessons – Lesson 7 – PHP Functions and Functional Programming
Javascript Lesson 5 Arrays, Functions for Working with Arrays
In this lesson, we’ll explore another JavaScript data type: arrays. We’ll also look at some functions for working with strings and arrays. The rest of the functions will be covered in the following lessons. For an introduction to arrays, you can check out the materials on PHP arrays: