Pro HTML5 and CSS3 Design Patterns
CHAPTER 14 ■ IMAGES Shadowed Image cont. Pattern^ HTML ^ CSS .shrinkwrapped { float:LEFT_OR_RIGHT; }^ .shadowed { backgroun ...
CHAPTER 14 ■ IMAGES Rounded Corners HTML <div class="bg"><div class="tl"><div class="br pad"> You can nest two ...
CHAPTER 14 ■ IMAGES Rounded Corners Problem You want to round the corners of an element’s box. You want the corners to expand an ...
CHAPTER 14 ■ IMAGES Rounded Corners cont. Creating rounded corners from rounded rectangle images Creating the Three Rounded Rect ...
CHAPTER 14 ■ IMAGES Rounded Corners cont. Detailed Solution You can assign a background image to each nested division. I use six ...
CHAPTER 14 ■ IMAGES Image Example Representative Excerpts from the HTML <h1>Northwest USA</h1> <div id="states"&g ...
CHAPTER 14 ■ IMAGES Image Example Example This is not a design pattern but an example that illustrates how the design patterns i ...
C H A P T E R 15 Tables Tables are one of the most useful and complex structures in HTML. This is the first of two chapters on t ...
CHAPTER 15 ■ TABLES Table HTML <h1>Table</h1> <h2>Simple Table</h2> <table> <tr> <th>1 ...
CHAPTER 15 ■ TABLES Table Problem You want to create a table to present data in rows and columns. Solution At its simplest, a ta ...
CHAPTER 15 ■ TABLES Row and Column Groups HTML <h1>Row and Column Groups</h1> <h2>Row Groups</h2> <ta ...
CHAPTER 15 ■ TABLES Row and Column Groups Problem You want to group together rows and columns to make it easy to style groups of ...
CHAPTER 15 ■ TABLES Table Selectors HTML <h1>Table Selectors</h1> <table id="t1"> <thead> <tr class=" ...
CHAPTER 15 ■ TABLES Table Selectors Problem You want a simple, flexible, and generic way to select a column, a row, or a cell fo ...
CHAPTER 15 ■ TABLES Separated Borders HTML <h1>Separated Borders</h1> <h2>Boxed Table</h2> <table cla ...
CHAPTER 15 ■ TABLES Separated Borders Problem You want to put independent borders around tables and cells. Solution You can appl ...
CHAPTER 15 ■ TABLES Collapsed Borders HTML <h1>Collapsed Borders</h1> <h2>Boxed Table</h2> <table cla ...
CHAPTER 15 ■ TABLES Collapsed Borders Problem You want to merge table and cell borders. Solution You can apply the border-collap ...
CHAPTER 15 ■ TABLES Styled Collapsed Borders HTML <h1>Styled Collapsed Borders</h1> <table id="t1"> <tr cla ...
CHAPTER 15 ■ TABLES Styled Collapsed Borders Problem You want to assign borders to rows and columns in a table with collapsed bo ...
«
12
13
14
15
16
17
18
19
20
21
»
Free download pdf