Category Archives: CSS Tips and Tricks

Learn how to make CSS edits for your website content! A1WebsitePro coding experts give you all the css tips and tricks to help you add dynamic design to everything in your website from creating shapes to styling the text on your web pages. Make all your images pop off the page with css coding. Now you can use all the tips and tricks of the experts with our easy to follow instructions.

Programming With PHP Housekeeping Cleaning Up Code Lesson 6

Programming With PHP Housekeeping Cleaning Up Code Lesson 6

Subscribe When we are programming with PHP remember that it is more artistic like poetry. Everyone will have a different style and you will as well. Many new programmers will not appreciate styles of other programmers because of inexperience. In programming however, housekeeping is very important. New programmers tend to create a lot of messy Read More

Using External CSS Libraries Absolute Beginner

Using External CSS Libraries Absolute Beginner

Subscribe You can use external CSS libraries to help code you website faster. CSS Libraries are CSS code preprogrammed. Once you know the structure of CSS code then you just name your elements or “tags” after the libraries structure. Many of the CSS libraries that are available help you create responsive websites. Programming CSS Code Read More

Great New Code Testing Tool

free code tester

Subscribe A1WebsitePro is now offering a great new code testing tool. This tool is useful for everyone who needs a quick resource to test the code that they are working with. A Helpful Tool For Use With Tutorials If you need a place to practice the codes that we provide in our lessons before you Read More

Coding Websites With CSS Absolute Beginner Web Development Lesson 9

Coding Websites With CSS Absolute Beginner

Subscribe This is the lesson where we actually begin to code a web page with html and CSS. We take the mock-up from the last post and make a real webpage with clickable links. List of CSS Commands Used Here are a list of CSS commands used in this lesson. color: changes the color of Read More

What is CSS Absolute Beginner Web Development Lesson 8

What Is CSS? Absolute Beginners Course Part 8

Subscribe What is CSS? CSS is an acronym for “Cascading Style Sheets”. We use CSS to style webpages. With it we can specify positions, colors, background and much more. CSS Syntax The CSS Syntax follows a basic structure. First your target the element that you want to change. Next you will give it some commands. Read More

DIV TAGS ID’S CLASSES CODING MADE EASY PART 3

DIV TAGS ID'S CLASSES CODING MADE EASY PART 3

Subscribe To set a div tag we type out the tag just like we would do any other tag, “<div></div>”. It is important however that you set id’s or classes to these div tags so we can target them for styling. We use CSS Cascading Style Sheets for styling our webpages. First we need to set Read More

Make A Game CSS JavaScript and HTML

Make A Game CSS JavaScript and HTML

Subscribe This is a tutorial on how to make a game with CSS, JavaScript and HTML. Making games are fun and they are not that hard to do. The object of this game is to shoot the objects and make them stop. We have some cool sound effects that we are loading into this as well. Read More

Viewports for Mobile Header Tags Quick Reference

Viewports for Mobile Header Tags Quick Reference

Subscribe Viewports for Mobile Header tags are something that I think we should be able to just copy and paste. It makes things faster when you are programming. A Viewport tag will auto enlarge text on smaller screens so they are mobile friendly. You would put this code in your header.php file. [code]<meta name="viewport" content="width=device-width, Read More

Child Themes in WordPress for Beginners Part 2 CSS

Child-Themes-in-Wordpress-for-Beginners-Part-2-CSS

Subscribe Child themes in WordPress for beginners part 2 CSS is a continuation of WordPress child theme creation tutorial.  So if you have not completed that tutorial you may want to look at it before you do this one. What We Are Going to Learn Browser to target CSS. Identify id’s to make changes. “#” Identify Read More

Style HTML Tables With A Lot Of Content

Style-HTML-Tables-With-A-Lot-Of-Content-1

Subscribe Have you ever wanted to Style  HTML Tables With A Lot Of Content? HTML tables are nice to use because they keep content separated in a nice neat order. However there are many times when webmasters want to put more information into a table cell that makes the table distort. The video below will walk Read More

DEALING WITH EMPTY TAGS IN WORDPRESS

DEALING WITH EMPTY TAGS IN WORDPRESS-1

Subscribe If you are dealing with empty tags in WordPress you have come to the right place. I have a very simple solution for you to carry out. Thanks to CSS3 we have a selector that will look for anything that is empty in your website and put a “display:none” commend to those empty tags. Read More

KALEIDOSCOPE CSS JAVASCRIPT ANIMATION IN WORDPRESS

KALEIDOSCOPE-CSS-JAVASCRIPT-ANIMATION-IN-WORDPRESS-1

Subscribe Do you want a KALEIDOSCOPE CSS JAVASCRIPT ANIMATION IN WORDPRESS? Check out the script below. This is a script written in JavaScript and CSS. It can tantalize the visual senses for a while. What is even more cool is that you can use your own pictures just by dragging and dropping them into your Read More

Setting Up a Cursor Pointer in CSS

Setting Up a Cursor Pointer in CSS

Subscribe This tutorial will be on setting up a cursor pointer in CSS. There are many methods to setting up a cursor pointer in CSS. A webmaster or web developer can virtually set up unlimited amounts of pointers in CSS. Below is a list of cursor styles in CSS that you can easily implement. Hover Read More

Make a Smiley Face in CSS

make a smiley face in css

Subscribe To Make a Smiley Face in CSS the first thing that we will do is set up the div’s. We will call our main div id smiley. We will then add div’s for the eyes and mouth. Here is the div structure. Main Div = smiley Left Eye = leye Right Eye = reye Mouth Read More

How to Apply a CSS Hover Effect

How to Apply a CSS Hover Effect

Subscribe Many times there are clients that want to know how to apply a CSS hover effect in their website. This is an easy process when done with CSS. First we will write a div tag and give it an id. We will call our example of a CSS hover effect hover. [code]<div id="hover"></div>[/code] Now we Read More