Tips & Tutorials – HTML & CSS

How To Make Unselectable Text In HTML (Simple Examples)

Welcome to a quick tutorial on how to make unselectable text in HTML. So you have a not-so-top-secret website that you want to protect? Stop people from highlighting and copying the text? There are 2 common ways to create unselectable text: In CSS, simply add the user-select: none property. In Javascript, document.getElementById(“TARGET”).onselectstart = function () …

How To Make Unselectable Text In HTML (Simple Examples) Read More »

Fade Background Image With CSS Javascript (Simple Examples)

Welcome to a short tutorial on how to fade an image background using CSS and Javascript. So you are working on a project with a nice background image that needs some fade effect? Bad news, it is not so straightforward. There is no background-image-opacity property in CSS. To fade a background image, the general steps …

Fade Background Image With CSS Javascript (Simple Examples) Read More »

Very Simple Light-Dark Theme Switcher With CSS Variables

Welcome to a quick tutorial on how to build a simple light-dark theme switcher using CSS variables. Looking to build your own switchable themes with CSS variables? Well, it really isn’t that difficult. A common way to build switchable themes using CSS variables is to: Create your HTML page as usual. <header>Header</header> <main>Content</main> Set the …

Very Simple Light-Dark Theme Switcher With CSS Variables Read More »

4 Ways To Display PHP Variables in HTML – Simple Examples

Welcome to a beginner’s tutorial on how to display PHP variables in HTML. So you have some PHP variables that you want to “insert” into an HTML element? There are a couple of ways to display PHP variables in HTML: Use delimiters to weave between PHP and HTML – <p><?php echo $VAR; ?></p> Use the …

4 Ways To Display PHP Variables in HTML – Simple Examples Read More »