Adding CSS rules for the video panel


show more Adding CSS rules for the video panel provides you with in-depth training on Developer. Taught by Chris Converse as part of the Create a Sliding Tabbed Panel with jQuery and Dreamweaver show less
please wait ...

Adding CSS rules for the video panel

Now with index.html file open up in Dreamweaver, let's switch back to Design view, and let's create our first CSS rule to target the selected state of the Video tab. So let's come over to the CSS Styles panel. Let's create a new rule. Let's create a compound rule. So this is going to be .sp, space, .tabs, space, .video.selected. Let's click OK.

The properties we are going to change inside of here, under Color, for the font color, let's change this to #ffce6f. Let's come over to Background color. We are going to set the background color to #3a3563, and let's come over to Border, uncheck Same for all, and for the Bottom Border, we are going to set solid, 1 pixel, and the color here is going to be #354e5c, then click OK.

So now we are going to have a custom style for the selected state of the video tab. Next, let's create another rule, another compound rule. This one is going to be .sp, space, .panels, space, .video. Let's click OK. Let&#...

Adding CSS rules for the video panel
Video duration: 4m 34s 1h 6m Intermediate

Viewers:

Adding CSS rules for the video panel provides you with in-depth training on Developer. Taught by Chris Converse as part of the Create a Sliding Tabbed Panel with jQuery and Dreamweaver

Subjects:
Developer Web
Software:
Dreamweaver jQuery
Author:
please wait ...