Html
Html posts, videos, courses, and more
3 days ago
View Post
A brief guide to ::before and ::after in CSS | Tutorial
In this post, we'll discuss about the **::before and ::after use cases.
Intro
The ::before and ::after are CSS pseudo elements, and they allow you to add content to the page without having any additional HTML. While they are not technically part of the DOM they will appear as if they are.
These pseudo elements are mostly used to...
3
Select One:
2 weeks ago
View Post
GREAT 20+ CSS TOGGLE EXAMPLE
If You Like This Article then check Out more Examples
50+ CSS Toggle Switches
1.
Title:- Pure CSS Toggles
Author:- Rafael González
Made With:- HTML CSS JAVASCRIPT
{% codepen https://codepen.io/rgg/pen/waEYye %}
2.
Title:- CSS Theme Switcher
Author:- Michelle Barker
Made With:- HTML CSS
{% codepen https://code...
9
Select One:
2 weeks ago
View Post
Extracting TailwindCSS from HTML
I've recently run into a scenario where I want to design a one-off page using TailwindCSS with the CDN link; however, including the CDN link would mean that my page load is a heavy 3MB 🙁.
Instead of installing Tailwind with one of the recommended installation steps, I decided to use the PurgeCSS CLI to extract only the classes I...
7
Select One:
1 month ago
View Post
111 amazing resources you're gonna love 💖
Hello Devs 👋
This is Savio here. I'm young dev with an intention to enhance as a successful web developer. I love building web apps with React. I have proved my superiority in frontend technologies.
Today, I'm gonna share 100+ super amazing resources every developer are gonna love for sure 💖 I hope you'll enjoy this article.
3...
7
Select One:
1 month ago
View Post
How to drag an element using javascript
While building out a new image generator, I needed a way to drag and move HTML elements inside of another element. Take a look at what I was building below:
This is actually the new Post Image Generator that you can use here on the DevDojo to generate some nice looking cover images 😉.
Let's cover how we can easily add this func...
5
Select One:
1 month ago
View Post
Everything about HTML Tags
HTML tags are like keywords that define that how web browsers will format and display the content. With the help of tags, a web browser can distinguish between HTML content and simple content. HTML tags contain three main parts: an opening tag, content, and closing tag. But some HTML tags are unclosed tags e.g. br and hr tag. If...
3
Select One:
2 months ago
View Post
Web developer roadmap in 2021 and beyond
If you found value in this thread you will most likely enjoy my tweets too so make sure you follow me on Twitter for more information about web development and how to improve as a developer.
1. Learn how the internet works
Zero to mastery playlist
MDN Introduction
2. Learn HTML
HTML Crash Course For Absolute Beginners
Basic HTML...
1
Select One:
2 months ago
View Post
HTML5 Basics for Absolute Beginners
Hello and welcome again to my little corner. I am appreciative of the response I got to my previous post and if anything, that has motivated me to continue to make this a date.
So without further ado, let’s begin to get our hands dirty. I promise to keep it simple for my absolute beginners.
WHAT IS HTML?
The full meaning of HTM...
4
Select One:
5 months ago
View Post
Avatars: Design and Build an Admin Dashboard with Preons
This is part of a series to build an admin dashboard with Preons.
Disclaimer! I am the author of the toolkit, but the principles can be applied to other functional css libraries.
End goal
Create a user profile avatar using HTML and CSS classes
Avoid writing custom CSS
Before we start
You'll need:
An IDE, a code playground...
3
Select One:
6 months ago
View Post
How to generate title slugs in Laravel?
Introduction
If you are not sure what a slug exactly is, you should go through this post here first:
https://devdojo.com/devdojo/what-is-a-slug
There are many reasons why you would want to have a nice slug for your posts rather than accessing them via their ID, for example.
In this tutorial, you will learn how to use the title o...
9
Select One:
9 months ago
View Post
How to Create Custom Laravel Maintenance Page?
Introduction
More often than not you would need to perform some maintenance for your Laravel website.
Luckily Laravel makes it super easy to put your application in maintenance mode!
In this tutorial, I will show you how to do that, and also how to change the default Laravel maintenance page with a custom maintenance page that m...
8
Select One:
1 year ago
View Post
How to Append HTML to Another Element
Appending HTML to the end of another element is very simple. Most people shy away from jQuery nowadays so it's important to know how to append HTML to another element in Vanilla Javascript.Let's say that you want to append a string of HTML to the end of another element with an id of app, here's how you can accomplish this:
8
Select One:
2 years ago
View Course
HTML5 Platform Game
In this course we'll be showing you how to create an HTML5 Platform Game. In this course we'll be walking through step-by-step on how to draw an intro screen, draw the character to the screen, capture user input, collision detection, and so much more.Let's get started in the next video where we'll show you how to add a canvas an...
2
Select One:
2 years ago
View Course
HTML Basics
In this course you are going to learn the basics of HTML. This course contains 10 easy to consume videos which you can complete in under 40 minutes. At the end of this course you will be able to code HTML websites. You can find the course breakdown below:
3
Select One:
2 years ago
View Post
Create your first HTML5 game with Phaser.js
Everybody loves classic games. How many of you remember the retro snake game from old Nokia phones? We sure do. This is why for this lesson we decided to recreate it using HTML5. There is a great open source game development framework called Phaser that we will use.You will learn about sprites, game states and how to use the pre...
1
Select One:
2 years ago
View Post
Get a Preloader on Your Site with jQuery
Preloaders (a.k.a. loading animations) are animations that run between page-loads or as your site gathers information. The two most common types of preloaders are the ‘spinner’ or ‘status bar’. You’ve likely encountered thousands of these while surfing the web.Check out loading.io to generate your own custom preloader.STEP ONE:...
Select One:
3 years ago
View Episode
Creating a Sticky HTML Element
In this video I want to show you how to create a basic Sticky HTML element using the CSS fixed position property. You will also learn how to make the element stick when a user scrolls to a specific position.You can check out the demo below of the sticky element that we are going to create in this video here: https://codepen...
Select One:
3 years ago
View Episode
HTML 5 Storage
In this video you'll learn how easy it is to use HTML 5 storage. HTML 5 storage makes it super easy to store key/values in your website or your web application. In many cases you may want to use HTML 5 storage instead of cookies or sessions.We'll teach you how to:
Select One:
5 years ago
View Episode
HTML & CSS Intro
In this beginner video we'll show you how to create a simple HTML & CSS page. Using any plain text editor, you can easily create an HTML page in minutes. Open up your plain text editor and drop in the following text:
Select One:
10 years ago
View Post
HTML5 video 101
HTML 5 is the new HTML standard for constructing and building pages to be viewable in web browsers. HTML5 adds a lot of new features that HTML 4 never had a few of these features include local web-app storage, canvas drawing, and the video element. The feature that we are going to briefly discuss in the post is the video element...
Select One:
10 years ago
View Post
The best way to add rounded corners using CSS and HTML
There are many ways out there to create simple rounded corners in CSS and HTML; however, some of them are combersome and they either take up a lot of code or they require you to use images. The easiest and best way that I have found for adding rounded corners to boxes in CSS (compatible with latest browsers) is the following:
Ad...
Select One:
11 years ago
View Post
HTML Clear Default Text in input text box
After several times of searching for a solution for clearing the default text from an HTML input text box several times and coming up with good results; however, some incompatible with some browsers. I had found some that worked well with all browsers; however, they had some cumbersome javascript files that I had to include.
Ins...
Select One:
Loading More Content
