HTML Tutorial - Additional Materials
With HTML, you can create your own website. This HTML tutorial will teach you a lot about building an HTML website. The HTML lessons are easy to understand, and you will enjoy learning HTML.
CSS Tutorial
So, you've read a book on HTML and now you're taking the next step toward creating your own beautiful website by learning CSS. Why do you need CSS? If you've read my *First Steps in HTML*, you probably noticed how concise that guide is. I intentionally skipped many tags and attributes related to styling: italic, bold, color, shape, emphasis. I did this assuming that you won't need them.
CSS Tutorial - Lesson 1 - Including CSS Styles
I wonāt explain why CSS is needed. If youāve opened this tutorial, it means you want to learn it. Iāll just say that CSS has powerful capabilities that allow you to build layouts of any complexity. In turn, using CSS means you'll need to stop using various HTML tag attributes like size, color, bgcolor, align, and others, which will only āinterfereā with CSS.
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: