Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
584 views

Website: 1. How To Insert Table in Website

The document provides instructions on how to insert tables, create text color, understand declarations, create navigation menus, insert background color, center pages, add last updated text, add page breaks, create marquee text, and save and run a web page in HTML. It includes code examples and steps for implementing each of these common website features and functions.

Uploaded by

OrangBiaseLakers
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
584 views

Website: 1. How To Insert Table in Website

The document provides instructions on how to insert tables, create text color, understand declarations, create navigation menus, insert background color, center pages, add last updated text, add page breaks, create marquee text, and save and run a web page in HTML. It includes code examples and steps for implementing each of these common website features and functions.

Uploaded by

OrangBiaseLakers
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 12

WEBSITE

1. How to insert Table in Website


Tables have literally changed the look of the Web page. Originally, tables let people present data
(mostly numbers) in a column format. Designers quickly figured out ways to improve the layout
of their pages using tables. Although a bit complicated and sometimes difficult to understand,
tables do improve your layout and let you present your material in a more eye-appealing way.
For example, this page--in fact, this whole tutorial--has been developed using a four-column
table. The best way to understand tables is to look at the following illustration.

Step 1 Open up a text editor (remember, Simple Text for Mac and Notepad for Windows.
Step 2 Enter the following code:
<html>
<head>
<title> This is a page using tables </title>
</head>
<body bgcolor="ffffff" text="000000">
<h1>A Web Page Using Tables</h1>
<table border="1">
<tr>
<td>This is column one</td>
<td>This is column two</td>
<td>This is column three</td>
</tr>
</table>
</body>
</html>
Step 3 Save the file as table1.html

2. How to create text colour in website

One of the things you may want to do as you develop your website is to modify the
appearance of the text on your web pages. For example, you may want to use a
different font for the words, or you may want to put some text in bold or italics. Or
perhaps you may even want to change their colour ("color" if you useUS English). This
chapter shows you how you can do these things using the BlueGriffon web editor.
Please note this is the third chapter of the BlueGriffon tutorial series. If you are not
familiar with BlueGriffon, you may want to start from chapter 1 since I will assume that
you already know the things that I've covered in the previous chapters. In addition, if you
are completely new to web design, it may be best to begin with the article How to
Create / Make a Website.

1. Firefox
In dialog box: General (in the left pane), Windows
Menu items:Tools > Options
Macintosh Menu items: Firefox > Preferences
Fonts & Colors (button)

2. Opera
Windows Menu items: Tools > Preferences
Macintosh Menu items: Opera > Preferences
In dialog box: Fonts and Page Style (in the left pane)

3. What is a Declaration in website

1.Recommended Doctype Declarations to use in your Web


When authoring document is HTML or XHTML, it is important to Add a Doctype
declaration. The doctype declaration must be exact (both in spelling and in case) to
have the desired effect, which makes it sometimes difficult. To ease the work,
below is a list of recommended doctype declarations that you can use in your Web
documents.
2. Template
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>An XHTML 1.0 Strict standard template</title>
<meta http-equiv="content-type"
content="text/html;charset=utf-8" />
</head>

<body>

<p> Your HTML content here </p>

</body>
</html>

4. What is Navigation Menu in Website

1. A website navigation menu is the place on each page where links to


other pages on your website are displayed.
Click a topic below to learn more about your navigation menu.
2. Add a new page to a website navigation menu
3. Delete a page from a website navigation menu
4. How to prevent a navigation menu from being displayed on
a specific page
5. Change the order in which my pages appear on the site navigation
menu
6. How to prevent a page from being displayed on the website
navigation menu
7. Change the style and/or color of the Navigation Menu
8. Change the tab names on the Navigation Menu
9. Create drop down sub pages on the Navigation Menu
10. Built your own Navigation Menu.

2. The navigation menu on a website is like a road sign on a street or a level directory
in a shopping mall. You cannot reach your destination without first knowing where
you are. Like in real life, navigation in web design is very important and plays a major
role in a websites usability as well as in user experience.

Users wont find it confusing because they already have experience with
menus like this.

5. Insert Background Colour


You can set the background color of your web page without using any graphics by simply
using the bgcolor attribute in the <body> tag. It is a good idea to always set the background
color of your web page if you are using a background image just in case viewers have their
browsers set to not display graphics. This is especially important if you have carefully
matched your web page text color to contrast with your background image. In the absence
of your background image and a background color definition, your text may become
difficult to read and in some instances may disappear altogether. The syntax for setting the
background color of your web page goes as follows:

1. Your background image should be seamless otherwise it will look awkward and
unattractive.
2. Your background image should contain either mostly light or mostly dark
colours to facilitate choosing an appropriate contrasting text color.
3. Your web page text color and the general color of your background image must
contrast enough to render readability.

Seamlessness

When an image is seamless, its opposing edges match up and blend together such that when the
image is tiled, the seams between the tiles are indistinguishable. Let's use mycoolpic.gif from
the previous page in this tutorial to further illustrate.

6. Set page to Center


The most common LCD monitors on the market today follow the wide-screen format.
That wide ratio can play havoc with Web site designers and their layout of Web pages.
However, with a little bit of Cascading Style Sheet (CSS) code, you can control your Web
page design by centering it on any screen despite its horizontal to vertical ratio.

1. Sample CSS Code

2. Centering Web Page Content

3. Finished product:

7 . Insert Last updated


1.

You can use javascript, place this where you want the text to display (NOTE: If you are using
a webpage editing program like frontpage, dreamweaver or similar you will need to be in
source or code view for inserting this to work)

Code:

<script type="text/javascript">
<!-var m = "This page was last updated: " + document.lastModified;
var p = m.length-8;
document.writeln("<center>");
document.write(m.substring(p, 0));
document.writeln("</center>");
-->
</script>

2. the script tag should look like <script type="text/javascript">


also it is preferable to use the dom to insert content into the page, not document.write.
in the head:
PHP Code:

<script type="text/javascript">
onload = function(){
document.getElementById("lastModified").innerHTML = "Page last changed " +

document.lastModified.split(" ")[0];
}
</script>

3. PHP Code:
<script type="text/javascript">
var pcs = document.lastModified.split(" ")[0].split("/");
var date = pcs[1] + '/' + pcs[0] + '/' + pcs[2];
onload = function(){
document.getElementById("lastModified").innerHTML = "Page last changed " +
date;
}
</script>

8.Page Brake
There are several strategies you can use to insert page breaks within an HTML document, thus
ensuring that the printed document does not break over lines, graphics, etc. There are
limitations, however, and these are listed below.
1.Summary

1. auto
2. Applies toblock-level elements in the normal flow of the root element. UA may also apply it to
other elements like table-row elements.
3. Inheritedno
4. Mediavisual, paged
5. Computed valueas specified
6. Animatableno
7. Canonical orderthe unique non-ambiguous order defined by the formal grammar

2.Syntax
Formal syntax: auto | avoid
page-break-inside: auto
page-break-inside: avoid
page-break-inside: inherit

Specifications
Specification

Status

Comment

CSS Paged Media Module Level 3


The definition of 'page-break-inside' in that

Working Draft

specification.

CSS Level 2 (Revision 1)


The definition of 'page-break-inside' in that
specification.

Recommendatio
n

9 . Create Marquee Text

Allows this property on more


elements.

Initial definition.

10 . How to Save and Run web


1

Conclusion

Especially I want to thank you to Encik Syukri teching me and my friend


About how to know website.

You might also like