HTML Frames Examples

This page contains HTML frames examples. These are examples of frames-based websites that you can use as a starting point for your own frames-based website.

Each example includes copy/paste code that you can use to start your own frames-based website.

HTML5 Compliant Frames

These examples use CSS to achieve HTML5 compliant frames.

HTML5 does not support the <frameset> and <frame> tags which were traditionally used to create frames-based websites. Therefore, these examples use CSS to provide similar functionality that is also HTML5 compliant.

2 Columns, Left Menu

2 column frames layout — left menu template

View Source | Preview

2 Columns, Right Menu

2 column frames layout — right menu template

View Source | Preview

2 Rows, A

2 Rows, 2 columns, A

View Source | Preview

2 Rows, B

2 Rows, 2 columns, A

View Source | Preview

2 Rows, 2 Columns, A

2 Rows, 2 columns, A

View Source | Preview

2 Rows, 2 Columns, B

2 Rows, 2 columns, B

View Source | Preview

2 Rows, 2 Columns, C

2 Rows, 2 columns, C

View Source | Preview

2 Rows, 2 Columns, D

2 Rows, 2 columns, D

View Source | Preview

2 Rows, 2 Columns, E

2 Rows, 2 columns, E

View Source | Preview

2 Rows, 2 Columns, F

2 Rows, 2 columns, F

View Source | Preview

2 Rows, 2 Columns, G

2 Rows, 2 columns, G

View Source | Preview

2 Rows, 2 Columns, H

2 Rows, 2 columns, H

View Source | Preview

3 Rows, 2 Columns, A

3 Rows, 2 columns, A

View Source | Preview

3 Rows, 2 Columns, B

3 Rows, 2 columns, B

View Source | Preview

3 Rows, 3 Columns

3 Rows, 3 columns

View Source | Preview

Traditional Frames Examples

The following templates use the <frameset> and <frame> elements to create a frames based web page.

You can download each example separately or you can download all HTML frames templates here.

These frames examples are not supported by HTML5. To create HTML5 compliant frames, see the examples above (under "HTML5 Compliant Frames")

Example 1 (2 Columns):

View Example
Download Zip File
OR
Copy/Paste the Code

Example 2 (2 Rows):

View Example
Download Zip File
OR
Copy/Paste the Code

Example 3 (2 Columns, 2 Rows - A):

View Example
Download Zip File
OR
Copy/Paste the Code

Example 4 (2 Columns, 2 Rows - B):

View Example
Download Zip File
OR
Copy/Paste the Code

Example 5 (2 Columns, 3 Rows):

View Example
Download Zip File
OR
Copy/Paste the Code

Example 6 (3 Columns, 3 Rows):

View Example
Download Zip File
OR
Copy/Paste the Code

Enjoy this page?