CSS Buttons (part fin)

Okay, onto the final half of the CSS button tutorial. This part will deal with the code (CSS and HTML) and is quite easy. You will need two pieces of code for this to work. The CSS portion can be found here.

The HTML portion is simply

<a class="button" href="URL" target="blank" onclick="this.blur();"><span> (button text) </span></a>

And on to the video part of the instruction. Again I would suggest watching this in fullscreen at 720p^HD:

Comments

basic html tables

Hey all, I figure that I would expose you guys to the basics of creating tables in html. There are many ways to do this. The wysiwyg way of constructing a table would be to use the built-in eCollege table wizard, or to build a table in in MS Office or Dreamweaver. These methods offer limited customization, as is the nature of visual editors. In order to really customize every aspect of the table, you must have a working knowledge of the html used to create the table. The basic elements of a table are as follows: row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, cell 2 This is what the code for a basic table with a border looks like. And this is what that table would look like: row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, cell 2 The elements include table rows <tr> and table definitions <td> which are the individual cells. { As an aside, if you ever want to include an empty cell in a table, make sure you put the code:  . That...

Canvas Conference: InstructureCon 2013

This last week I had the opportunity to attend Instructure's annual conference which focuses on it's flagship product, Canvas. Founded in 2008, Instructure launched Canvas in 2011, and in that same year hosted its first annual conference. The attendance at the first conference was meager, but in 2012 the attendance numbers grew to 600 attendees. This year marked the third annual conference, with 1,200 attendees and a giant inflatable panda mascot flocking to the resorts of Park City. Including staff and volunteers, some 1,500 people gathered to present and attend sessions. After-hour festivities were themed based on the 1980's and included a conference carnival, visits from the Ghostbusters, a DeLorean (yes I had to google the spelling), and concerts from an 80's cover band and MC Hammer himself. The festivities were grand (and the 80's florescence was blinding), but the real value of the conference was obviously in the sessions. Here are a few ...

<hr> styling with CSS

Yea, I know that it has been a while since the last post. I've been busy lately! Anyway, this one will be very short and sweet and perhaps moderately useful every once in a while. We will discuss how to modify the properties of a horizontal rule <hr>. <hr>'s have been revered as rogue html elements for many years now. They don't behave well and often when styled they appear differently based on which browser you are using. So why bother even learning this, you ask? And I answer: I don't know. So let's get into it, shall we? In days past, you could actually style <hr>'s using pure html. You could type something like <hr size="5px" width="90%" align="center"> and it would actually render. But that is all deprecated now. As is becoming the trend with everything web-design related in terms of formatting, you'll want to switch over to CSS for that stuff. Let's begin exploring the possibiliti...

TCS Instructional Design

Search This Blog