Active HTML / XHTML / CSS Posts
How To: Convert a Photoshop mockup for your website design
Watch this video series to learn how to start the conversion process of an Adobe Photoshop mockup of a website, into a real live CSS based website.
How To: Position an image with a Div layer in CSS
This is a Cascading Style Sheet (CSS) Tutorial that will help you position an image using a Div layer.
How To: Make a favicon for your website using MS Paint
Give your website a truly professional look by designing your own favicon. Your favicon will appear in the address bar and when your site is bookmared. Using a simple software like MS Paint and following the instructions of this video for editing HTML, you can make your custom favicon appear.
How To: Add Facebook, Twitter, and other Social Media icons to your Wordpress header
Trying to get more traffic for your Wordpress blog? Looking to connect with the people who visit you online? This video will show you how to facilitate web interactions by adding social media icons to your blog's header. This video uses the 2010 theme to demonstrate. CSS may be intimidating, but this video will show you exactly what to do.
How To: Start programming your first pages in CSS
Looking for a place to quickly and easily learn CSS? This is the tutorial for you! This video covers every basic concept that you'll need to get under your belt, and shows you how to code a few simple procedures using CSS.
How To: Use an external stylesheet for greatest consistency in HTML
A stylesheet helps keep the design elements for your website consistent - such as making sure all your headings and links are formatted exactly the same way. This tutorial shows you how to set up an external stylesheet for your own HTML based website.
How To: Increase your productivity by mastering the hierarchy concept in CSS
This tutorial gives a beginning web designer a few useful strategies for improving efficiency and productivity when working with HTML and CSS. Hierarchy is one of these concepts, and the video also covers grouping elements, overriding groups and Document Oject Model.
How To: Set up a Box Model when using CSS to design your website
If you don't learn anything else about writing a website using CSS, learn this. This video teaches you about how to use the Box Model, which will save you hours of frustration and re-tinkering your website once you master how to use it.
How To: Create a free website from scratch
You can create a free website using HTML. HTML is hyper text mark up language. Create a folder "my webpage" with all of the images and information for the webpage. Use notepad to write the HTML for the website. Notepad plus is the best which can be found on Sourceforge. Open the browser and the notepad and begin to construct. These codes will help in the creation of the page: <html> opens instructions </html> closes instructions. These are called tags. One opens the commands or instructions a...
How To: Hack websites using cross-site scripting (XSS)
In this episode of Full Disclosure we are explaining the website attack known as Cross-Site Scripting (XSS). Cross-Site Scripting is a type of security vulnerability that affects web applications that do not sanitize user input properly. This kind of vulnerability allows an "attacker" to inject HTML or client side script like JavaScript into the website. Cross-Site Scripting is most commonly used to steal cookies. Cookies are used for authenticating, tracking, and maintaining specific informa...
How To: Make a hyperlink (clickable link or image) in HTML
Have you ever gone to websites and seen an entire URL address you have to copy and paste into your browser window? Is the thought of having such an inconvenience on your page making you wish there was a better way? Today is your lucky day because success is going to teach you step by step how to make a HTML hyperlink that user of your website can use to navigate to different portions of your website without the inconvenience of copying and pasting long dragged out links.
How To: Copy and paste HTML links embedded in text
In this video tutorial, find out how to copy and paste HTML links embedded in the text with a breeze. No longer will you have to worry about re-entering every single link one by one. This video will give you a quick and easy solution to solving your most worrisome problem. Enjoy!
How To: Change the size of an embedded video using HTML
In the embed code for a video, you can change certain numbers for the width and height of your video in HTML.
How To: Use floats to help program your website when using CSS
This tutorial goes from the box model and then progresses on to show you how you can use floats when designing a website using CSS. Which layout you choose will determine how your website looks, so make sure you pick the one that's the best for your needs.
How To: Learn the difference between relative and absolute positioning in CSS
This is a tutorial on CSS floats, which shows you the difference between relative and absolute positioning on your website. This also touches a little bit on the fixed position, so you can figure out which style is the best for your own website.
How To: Design a website with a fixed layout using CSS
A fixed layout means your website will not change size no matter the size of the browser it's being used in. This tutorial shows you an easy and quick way to set up the CSS for your website to give it a fixed layout.
How To: Program a liquid layout for your website using CSS
A liquid layout will change size as the browser also changes size. It's a good layout to use if you're trying to design a website that can be read on many different size screens and browsers. Here's how you can implement a liquid layout in three minutes.
How To: Create a custom HTML image map for your blog or website
First, make sure that your image is hosted on a secure place online (such as your own Photobucket account). Then go to ImageMaps.com and use this free site to create your own image map that can now be added to your website.
How To: Create a web form using Google Docs and embed it on your website or blog
Start with the free Google Docs, which you can get with any Gmail account. Then get one of the free web form templates (this video uses the Contact Us form as an example) and then edit and embed it on your own website.
How To: Make an animated digital clock for your website using Javascript CSS
Need to make a custom, digital clock that will run in all major desktop and smartphone browsers? This tutorial shows you how to employ Javascript functions to communicate in real time with web page elements to get a slick CSS animated clock. Cool, eh?
How To: Use CSS opacity settings to adjust your website elements' transparency
Want to take control of your web site elements? This tutorial helps you tone down their transparancy or turn it up! Use your CSS opacity ability to get the look you want. Set your text apart from background elements by separately adjusting thier opacity.
How To: Use the Weltmeister level editor and Impact engine to make games in HTML5
HTML5 has great potential to eliminate browser compatibility issues and allow web games to be played cross-platform by mobile, PC, Mac, and Linux users. Impact is the first game development engine available for HTML5, as demonstrated in this video, and Weltmeister is the 2D level editor included in the release. This video will show you how to use Weltmeister to make 2D levels for your games. Use the Weltmeister level editor and Impact engine to make games in HTML5.
How To: Get Started with Microsoft Expression Web 4
Getting Started Steps for Beginners If you are brand new to Expression Web 4, then read the following guide to quickly set up your web site and web pages.
How To: Use Notepad++ to create an XHTML 1.0-strict template
In this clip, you'll learn how to use the Notepad++ text editor to create XHTML 1.0-strict templates. For more information, including a complete demonstration, and detailed, step-by-step instructions, as well as to get started creating your own XHTML templates, take a look.
How To: Use CSS to create a vertical navigation menu with a current page indicator
In this clip, you'll learn how to create a vertical nav menu with a current page indicator using HTML and CSS (cascading style sheets). For more information, including a complete demonstration, and detailed, step-by-step instructions, as well as to get started creating your own dynamic navigation menus, take a look.
How To: Create a vertical navigation bar from an unordered list with HTML & CSS
In this clip, you'll learn how to create a vertical nav bar from an unordered list with HTML and CSS (cascading style sheets). For more information, including a complete demonstration, and detailed, step-by-step instructions, as well as to get started creating your own navigation bars, take a look.
How To: Design and code a website from scratch with HTML, CSS jQuery & PHP
Interested in learning how to code and create a modern website from scratch? Let this eight-part video tutorial series be your guide. It's easy and this series presents a complete, step-by-step overview of the process. For more information, including detailed instructions, and to get started creating and coding your own website groups, take a look.
How To: Use web application Sumo Paint
In this video, we learn how to use the web application, Sumo Paint. First, go to the website Sumo Paint and the website will start to load in a new window a Flash application. Once it's fully loaded, you will be able to add an image and then start to edit it. There are several different tools available on the side, whether you need to resize, crop, erase, or anything else to your picture! This is a great website for editing and makes everything simple. There is also a toolbar on the top where...
How To: Insert HTML content over Photoshop slices
If you already know how to make Photoshop slices and bring them into Dreamweaver for use on your website, there's really only one more thing you need to know to utilize these slices properly on your website: how to insert HTML content over the sliced images to make your website both functional and cool-looking. What more could you want your site to be?
How To: Use Stock.Xchng to access free stock images
In this Computers & Programming video tutorial you will learn how to use Stock.Xchng to access free stock images. The site is at SXC. Go to this site and you will find a large number of stock images that are free to use. And every day new photos are being added. You can search for an image by category by clicking on the search box and scrolling down to find your category. You can also type in the search box to find a photo of your liking. The image also tells you what is the screen size, prin...
How To: Create a free flash website using Wix
In this video, we learn how to create a free flash website using Wix. First, log online and go to "www.wix.com" and either create a screen name or log into your account. Now, click on "create" and choose a premade template or make one from scratch. Now, change the background to a color you prefer, then add in a frame and different media to your page. You can also add a title to the website by clicking on the "text" section. You can play around with the different effects and additions, making ...
How To: Add a background to a CSS image container div
See how to add a background image to an CSS image container div with this handy hand-coder's guide. Whether you're using a fancy WYSIWYG (or what-you-see-is-what-you-get) page editor like Adobe Dreamweaver CS5 or a barebones text editor like Notepad, if you want to build websites, you'll need to have some understanding of HTML (for the structure of your web pages) and CSS (for their style). And this free coder's guide will get you started along that path.
How To: Use and work with CSS attribute selectors
In this free video CSS tutorial, you will learn how using attribute selectors easily add images to download links and email links. Whether you're using a fancy WYSIWYG (or what-you-see-is-what-you-get) page editor like Adobe Dreamweaver CS5 or a barebones text editor like Notepad, if you want to build websites, you'll need to have some understanding of HTML (for the structure of your web pages) and CSS (for their style). And this free coder's guide will get you started along that path.
How To: Use floats and absolute & relative positioning in CSS
In this free video CSS tutorial, you will learn how to use floats and absolute and relative positioning. Whether you're using a fancy WYSIWYG (or what-you-see-is-what-you-get) page editor like Adobe Dreamweaver CS5 or a barebones text editor like Notepad, if you want to build websites, you'll need to have some understanding of HTML (for the structure of your web pages) and CSS (for their style). And this free coder's guide will get you started along that path.
How To: Create a simple two-column layout with CSS
See a very simple way to create a two-column layout with pure CSS. Whether you're using a fancy WYSIWYG (or what-you-see-is-what-you-get) page editor like Adobe Dreamweaver CS5 or a barebones text editor like Notepad, if you want to build websites, you'll need to have some understanding of HTML (for the structure of your web pages) and CSS (for their style). And this free coder's guide will get you started along that path.
How To: Add an external style sheet to an HTML document
This clip will show you how to add external CSS stylesheets to an HTML document in a number of different ways while explaining the significance of ordering. Whether you're using a fancy WYSIWYG (or what-you-see-is-what-you-get) page editor like Adobe Dreamweaver CS5 or a barebones text editor like Notepad, if you want to build websites, you'll need to have some understanding of HTML (for the structure of your web pages) and CSS (for their style). And this free coder's guide will get you start...
How To: Create pure CSS drop-down menus without JavaScript
This clip will show you how to create pure CSS drop down menus without any JavaScript. Whether you're using a fancy WYSIWYG (or what-you-see-is-what-you-get) page editor like Adobe Dreamweaver CS5 or a barebones text editor like Notepad, if you want to build websites, you'll need to have some understanding of HTML (for the structure of your web pages) and CSS (for their style). And this free coder's guide will get you started along that path.
How To: Create a photo gallery with CSS
Learn how to easily create a CSS photo gallery with a unordered list and a little bit of CSS. Whether you're using a fancy WYSIWYG (or what-you-see-is-what-you-get) page editor like Adobe Dreamweaver CS5 or a barebones text editor like Notepad, if you want to build websites, you'll need to have some understanding of HTML (for the structure of your web pages) and CSS (for their style). And this free coder's guide will get you started along that path.
How To: Create a parallax background effect with CSS
In this clip, you will see how to create a cool parallax effect with some CSS and images. Whether you're using a fancy WYSIWYG (or what-you-see-is-what-you-get) page editor like Adobe Dreamweaver CS5 or a barebones text editor like Notepad, if you want to build websites, you'll need to have some understanding of HTML (for the structure of your web pages) and CSS (for their style). And this free coder's guide will get you started along that path.
How To: Create a basic layout for a web page with CSS
In this free web developer's guide, you will learn the basic of creating a basic CSS layout. Whether you're using a fancy WYSIWYG (or what-you-see-is-what-you-get) page editor like Adobe Dreamweaver CS5 or a barebones text editor like Notepad, if you want to build websites, you'll need to have some understanding of HTML (for the structure of your web pages) and CSS (for their style). And this free coder's guide will get you started along that path.
Next Page
Prev Page