Using CSS3 with Dreamweaver CS5
While I truly am excited by the new semantic elements in HTML5, as well as the possibilities that things like local storage will do for expanding the capabilities of websites, I have to admit that I’m really much more excited by the shiny new toys in CSS3. And, of course, with the recently released HTML5 pack for Dreamweaver CS5, I no longer have to “try” to remember the new CSS3 properties – I get them all with lovely code-hinting and code-completion right within Dreamweaver CS5.
In the following video, I show you how to use some of the really popular new properties – like using border-radius to add rounded corners, transform to rotate elements and transitions to create the illusion of an animated rollover.
There is a definite caveat that I want to make sure to mention – since CSS3 (and HTML5, of course) is still being developed, not all of the CSS3 properties are available in Dreamweaver CS5 (and in Live View some properties do not render). But even with that caveat, Dreamweaver CS5 now really rocks with CSS3. And again, if you’ve not looked at Dreamweaver lately, you can always download a 30-day trial.
July 16th, 2010 at 2:25 am
Really enjoying the HTML5/CSS3 videos, impatient for the next. Hurry hurry!!!
August 6th, 2010 at 9:36 am
Excellent video, thanks!
September 17th, 2010 at 11:25 am
Completely awesome. Wish I hadn’t bought CS4 only just last December.
October 29th, 2010 at 11:20 am
OH Thank You!! Just getting started and wanted to understand the CSS3 transitions. This was exactly what I needed. Thank you so much! *bookmarked*
October 29th, 2010 at 12:30 pm
Also, (and I AM new to all of this) why do the transitions not work with the click function. I want an image to move and another to expand from a fixed side. Is this possible using CSS?
November 23rd, 2010 at 5:12 pm
Just wondering if you’ve been able to implement html5 or css3 with this WordPress blog?
November 30th, 2010 at 3:17 pm
CSS3 Transitions and Transforms are only triggered by :hover and :focus. You can use Javascript to trigger the transform/transition by capturing any event available to JS such as click.
February 15th, 2013 at 3:51 am
I make website with dreamweaver and combine between css 2.1 with css3 I have error message when try to validate “Property border-radius doesn’t exist in CSS level 2.1 but exists in [css3] : 10px ” how do I fixing this problem? thanks sir