4. CSS Properties – Part 1 | Web Developer's Reference Guide

Sign In Start Free Trial

Book Overview & Buying
Table Of Contents

Web Developer's Reference Guide

By : Johanan, Khan, Zea

4.7 (3)

Web Developer's Reference Guide

4.7 (3)

By: Johanan, Khan, Zea

Overview of this book

This comprehensive reference guide takes you through each topic in web development and highlights the most popular and important elements of each area. Starting with HTML, you will learn key elements and attributes and how they relate to each other. Next, you will explore CSS pseudo-classes and pseudo-elements, followed by CSS properties and functions. This will introduce you to many powerful and new selectors. You will then move on to JavaScript. This section will not just introduce functions, but will provide you with an entire reference for the language and paradigms. You will discover more about three of the most popular frameworks today—Bootstrap, which builds on CSS, jQuery which builds on JavaScript, and AngularJS, which also builds on JavaScript. Finally, you will take a walk-through Node.js, which is a server-side framework that allows you to write programs in JavaScript.

Preface

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Free Chapter

1. HTML Elements

1. HTML Elements

DOCTYPE

html

Document metadata

Semantic content sections

Content sections

Inline elements

Embedded content

Tables

Forms

Drawing elements

2. HTML Attributes

2. HTML Attributes

Global attributes

Miscellaneous

3. CSS Concepts and Applications

3. CSS Concepts and Applications

Basic selectors

Combinators

Pseudo-classes

Validation

Pseudo-elements

Generated content

4. CSS Properties – Part 1

4. CSS Properties – Part 1

Animation

Background

Box model

Border radius

Unit

Flexible box (flexbox)

Summary

5. CSS Properties – Part 2

5. CSS Properties – Part 2

Fonts

Transform

Positioning

Text

Tables

Words and paragraphs

Paging

6. CSS Properties – Part 3

6. CSS Properties – Part 3

Page box

List

Counter

Drop shadows

Display and visibility

Masking and clipping

Image rendering and orientation

User interface

3-Dimensional

Summary

7. CSS Functions

7. CSS Functions

Filter

Colors

Gradients

Values

Miscellaneous

At-rules

Global CSS keyword values

Summary

8. JavaScript Implementations, Syntax Basics, and Variable Types

8. JavaScript Implementations, Syntax Basics, and Variable Types

History of JavaScript

JavaScript implementations

The language syntax

The character set

Data type

Variable, scope, and memory

9. JavaScript Expressions, Operators, Statements, and Arrays

9. JavaScript Expressions, Operators, Statements, and Arrays

Expressions

Operators

Statements

Arrays

10. JavaScript Object-Oriented Programming

10. JavaScript Object-Oriented Programming

Polymorphism

Objects

Functions and methods

Classes and modules

Inheritance

Built-in objects

11. Extending JavaScript and ECMAScript 6

11. Extending JavaScript and ECMAScript 6

Compatibility and goals

JavaScript subset and extensions

Scoped variables and constants

Shorthand functions

Multiple catch clauses

E4X – ECMAScript for XML

ECMAScript 6 features

12. Server-side JavaScript – NodeJS

12. Server-side JavaScript – NodeJS

File and process management

Utilities

The net module

The HTTP module

13. Bootstrap – The Stylish CSS Frontend Framework

13. Bootstrap – The Stylish CSS Frontend Framework

Introduction to Bootstrap foundations

Getting started

Layouts

The grid system

Typography

Tables

Lists

Forms in Bootstrap

Images

Navigation elements

The navigation bar

Panels

Breadcrumbs

Labels and badges

Pagination

Progress bars

Advanced Bootstrap/JavaScript plugins

Customizing Bootstrap

Websites built with Bootstrap

Bootstrap resources

14. jQuery – The Popular JavaScript Library

14. jQuery – The Popular JavaScript Library

The evolution of JQuery

Getting started

Using jQuery

Selectors

Events

Effects and animations

Callback

Chaining

jQuery and the document object model

jQuery traversing

Using AJAX in jQuery

Miscellaneous jQuery functions

jQuery plugins

jQuery resources

15. AngularJS – Google's In-Demand Framework

15. AngularJS – Google's In-Demand Framework

Modules (ngApp)

Routing (ngRoute)

Dependency injection

Controllers

Scope

Services

Promises

Expressions

Directives

Globals

Forms

Testing

Index

Index

Border radius

With this property, we can not only make rounded corners but also circles, ellipses, and other interesting shapes.

I admit that the term "rounded corners" is far less obscure than "border radius".

border-radius

The border-radius CSS property allows us to make rounded corners on almost any HTML element, and it looks like this:

border-radius: 20px;

Description

The border-radius attribute is also the shorthand syntax for the border-top-left-radius, border-top-right-radius, border-bottom-right-radius, and border-bottom-left-radius properties.

Using either a circle or an ellipse, we can create rounded corners:

There are two values: a length value and a percentage value.

Length value

This is when we use one of the following units: px, em, in, mm, cm, vw, and so on.

Percentage value

This is when we use percentages such as 50%, 85%, and so on.

We can use, one, two, three, or four values in the same declaration. We can also use a slash symbol, "/", to separate groups of values.

Tip

Sometimes, the...

CONTINUE READING

83

Tech Concepts

36

Programming languages

73

Tech Tools

Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.

Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.

50+ new titles added per month and exclusive early access to books as they are being written.

Web Developer's Reference Guide

Search

Your notes and bookmarks