can someone code these 10 commands into this html code for this webpage which i

ID: 2247713 • Letter: C

Question

can someone code these 10 commands into this html code for this webpage which i have pasted below and the link for the webpage is http://www.columbia.edu/~fdc/sample.html#convert

1. Add another list element to the top list that reads "11. New Section".

2. Create a new section, section 11 called 'New Section'

3. Link your new list element to the new section

4. Right align the text in the first section using in-line CSS

5. Create an external style sheet and link in the document

--From here on, all styling is done in the external CSS

6. Make every other section's text green (2,4,6, ect..)

8. Add a grey background to the table headers in section 8

9. In section 10, make the entire section only half the width of the page

10. Add a 2em padding to the image

<a href="http://www.columbia.edu/~fdc/">Frank da Cruz</a> 
Sat Jan 17 12:07:32 2004

<h3><a name="contents">CONTENTS</a></h3>

<ol>
<li><a href="#basics">Creating a Web Page</a>
<li><a href="#syntax">HTML Syntax</a>
<li><a href="#chars">Special Characters</a>
<li><a href="#convert">Converting Plain Text to HTML</a>
<li><a href="#effects">Effects</a>
<li><a href="#lists">Lists</a>
<li><a href="#links">Links</a>
<li><a href="#tables">Tables</a>
<li><a href="#install">Installing your Web Page on the Internet</a>
<li><a href="#more">Where to go from here</a>
</ol>

<hr>

<h3><a name="basics">1. Creating a Web Page</a></h3>

This page was typed by hand. Anybody can do this, you don't need any
special "web creation" tools or HTML editors, and the pages you make can be
viewed from any browser. To see how this page was made, choose
View Source (or View Page Source, or View Document Source) in your
browser's menu. A simple web page like this one is just plain text with
HTML commands (markup) mixed in. HTML commands themselves are plain text.

When you're just learning and want to experiment, you can do everything on
your PC. Create a new directory ("folder") for your website, and then put
the web-page files (HTML plus any pictures) in it. Use NotePad or other
plain-text editor (not word processor) on your PC to create an
<tt>index.html</tt> file, which you can view locally with your Web browser.
(You can also use word processors such as Word or WordPad if you save in
"plain text", "text", "text document", or "text document MS-DOS format".)
<a href="#install">Later</a> I'll explain how you can install your web site on
the Internet.

<dl>
<dt>Example for Windows:

<dd>Move your mouse cursor to the desktop. Right-click,
choose New, then choose Folder, and a "New Folder" appears,
with its name highlighted. Type "Web" to change the folder's name to Web
(or anything else you want). Then
Start <tt>-></tt> Run and type "notepad" to
start NotePad. Now you can create your first Web page.

</dl>

<hr>
<h3><a name="syntax">2. HTML Syntax</a></h3>

Web pages are written in Hyper Text Markup Language (HTML). HTML has three
special characters:
<tt><</tt>, <tt>&</tt>, <tt>></tt>.
An HTML command is enclosed in <tt><...></tt>, for example
<tt></tt>, which is a paragraph separator, or <tt></tt>
("begin bold") and <tt></tt> ("end bold"). So the following
HTML text:

<blockquote>
<pre>
This sentence contains bold text.
</pre>
</blockquote>

produces:

<blockquote>
This sentence contains bold text.
</blockquote>

A Web page starts with a series of HTML commands, and ends with
a few more. The contents go in between:

<blockquote>
<pre>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Sample Web Page</title>
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#ffffff" text="#000000">
</pre>

(Contents go here)

<pre>
</body>
</html>
</pre>
</blockquote>

The first line (DOCTYPE) specifies which language the page uses; just copy
this line1. The next line, <tt><html></tt>,
starts the page, and is matched by the last line, <tt></html></tt>,
which closes the page. <tt><head></tt>, starts the heading, which
contains a title to be displayed on the browser's title bar and a
declaration of the character set (usually US-ASCII, ISO-8859-1, or UTF-8).
<tt></head></tt> closes the heading.

The <tt><body></tt> statement starts the body of the document and can
contain specifiers for color and other attributes. This one chooses black
writing on a white background. The body is closed by
<tt></body></tt> statement.

As you can see, most HTML commands (but not all!) come in begin-end pairs:
<tt>...</tt>,
<tt><head>...</head></tt>, etc. The closing part of the command
has a slash (<tt>/</tt>) between the <tt><</tt> and the first letter of
the command.

Blank lines and line breaks are ignored. The browser automatically "flows"
your text into lines and paragraphs that fit in its window. Paragraphs must
be separated by <tt></tt>. Line breaks can be forced by
<tt> </tt>.

<dl>
<dt>Example for Windows:

<dd>Use the mouse to copy the HTML above into NotePad. Then save the file
(File <tt>-></tt> Save As...)
in your Web directory as <tt>index.html</tt>. Suppose your Windows username
is Olga. Then (depending on which version of Windows you have) this might
be:

<blockquote>
<pre>
<tt>C:Documents and SettingsOlgaDesktopWebindex.html</tt>
</pre>
</blockquote>

Now to see your new web page, just double-click on the Web folder and
then double-click on <tt>index.html</tt>.
</dl>

Now you're ready to start adding "content" to your web page. Go back to
NotePad and replace the title and "(Contents go here)" with whatever you
want. Any time you want to see the result, use
File <tt>-></tt> Save in NotePad and then
click the Reload button on your browser.

The next sections tell how to achieve different kinds of effects.

__________________ 
<ol><li>HTML 4.01 is chosen because it supports tables (new to HTML 3.2)
as well as a couple other desirable features, such as the ability to specify
an image width as a percentage of the Browser's window width, and a bunch more
character entity symbols such as <tt>&euro;</tt>
(new to 4.01). Otherwise we would stick with the oldest
available verifiable version, which is 2.0.</ol>

<hr>
<h3><a name="chars">3. Special Characters</a></h3>

HTML special "character entities" start with ampersand (<tt>&</tt>) and
end with semicolon (<tt>;</tt>), like "<tt>&euro;</tt>" = "€". The
ever-popular "no-break space" is <tt>&nbsp;</tt>. There are special
entity names for accented Latin letters and other West European special
characters such as:

<blockquote>
<table border>
<tr>
<td><tt>&auml;</tt>
<td>a-umlaut
<td> ä

<tr>
<td><tt>&Auml;</tt>
<td>A-umlaut
<td> Ä

<tr>
<td><tt>&aacute;</tt>
<td>a-acute
<td> á

<tr>
<td><tt>&agrave;</tt>
<td>a-grave
<td> à

<tr>
<td><tt>&ntilde;</tt>
<td>n-tilde
<td> ñ

<tr>
<td><tt>&szlig;</tt>
<td>German double-s
<td> ß

<tr>
<td><tt>&thorn;</tt>
<td>Icelandic thorn
<td> þ 
</table>
</blockquote>

Examples:

<dl>
<dt>For Spanish you would need:
<dd><tt>&Aacute;</tt> (Á),
<tt>&aacute;</tt> (á),
<tt>&Eacute;</tt> (É),
<tt>&eacute;</tt> (é),
<tt>&Iacute;</tt> (Í),
<tt>&iacute;</tt> (í),
<tt>&Oacute;</tt> (Ó),
<tt>&oacute;</tt> (ó),
<tt>&Uacute;</tt> (ú),
<tt>&uacute;</tt> (ú),
<tt>&Ntilde;</tt> (Ñ),
<tt>&ntilde;</tt> (ñ);
<tt>&iquest;</tt> (¿);
<tt>&iexcl;</tt> (¡). 
Example: Añorarán = <tt>A&ntilde;orar&aacute;n</tt>.

<dt>For German you would need:
<dd><tt>&Auml;</tt> (Ä),
<tt>&auml;</tt> (ä),
<tt>&Ouml;</tt> (Ö),
<tt>&ouml;</tt> (ö),
<tt>&Uuml;</tt> (ü),
<tt>&uuml;</tt> (ü),
<tt>&szlig;</tt> (ß). 
Example: Grüße aus Köln = <tt>Gr&uuml;&szlig;e aus K&ouml;ln</tt>.

</dl>

<a href="entities.html">CLICK HERE</a>
for a complete list. Cyrillic, Arabic, Hebrew, Greek. Japanese,
etc, are a bit harder, but
<a href="entities.html">doable</a>.

If you want to include <tt><</tt>, <tt>&</tt>, or <tt>></tt>
literally in text to be displayed, you have to write <tt>&lt;</tt>,
<tt>&amp;</tt>, <tt>&gt;</tt>, respectively.

<hr>

<h3><a name="convert">4. Converting Plain Text to HTML</a></h3>

If you have a plain text file that you want to convert to HTML, load the
file into a plain-text editor and then follow these steps.

<ol>
<li>Change all occurrences of "<tt>&</tt>" to "<tt>&amp;</tt>".
<li>Change all occurrences of "<tt><</tt>" to "<tt>&lt;</tt>".
<li>Change all occurrences of "<tt>></tt>" to "<tt>&gt;</tt>".
<li>Change any accented letters to HTML entity names (previous section).
<li>Put "<tt></tt>" between each paragraph.
<li>Insert the standard prolog at the top, substituting an appropriate title.
<li>Insert the standard epilog at the bottom.
<li>Save the result as <tt>xxx.html</tt>, where
<tt>xxx</tt> is the part of the original file's name before the dot.
For example, if the original file was <tt>letter.txt</tt>, save the edited
version as <tt>letter.html</tt>.
</ol>

If you are a <a href="http://www.columbia.edu/kermit/">Kermit</a> user, you
can find a script to convert plain text to HTML
<a href="http://www.columbia.edu/kermit/ckscripts.html#html">HERE</a>.

If the text contains lists, tables, or other structures, read on.

If you have a Microsoft Word document you want to convert to HTML, and your
copy of Word does not allow the file to be "Saved As" HTML, then save it as
plain text and follow the same instructions. In this case you lose the
"richness" (bold, italics, font changes, etc) when you save the file, and
will have to put the effects back by hand (next section).

</ol>

<hr>
<h3><a name="effects">5. Effects</a></h3>

The rest of this document shows what you can do with simple HTML commands,
but I don't explain how to do it. To see that, just tell your browser
to View Source and compare the HTML in the source window
with the result in the original window.

This sentence is bold. This sentence is
in italics. This sentence is in bold italics. <tt>This
sentence is in typewriter font.</tt> This sentence has underlined
words and underlined bold words.

This
sentence
has
colored
words.

This sentence has <big>big
words.</big> This one has <big><big>very big words</big></big>. This one has
very small words.

This is a "blockquote", which is like a regular paragraph, but it has bigger
margins. Begin a blockquote with <tt><blockquote></tt> and end
it with <tt></blockquote></tt>. Environments such as blockquotes,
lists, etc, that have a beginning and an end always use paired commands like
<tt><blah>...</blah></tt>.

This is a blockquote inside another blockquote, which shows how HTML
environments can be "nested".

</blockquote>

Here we are back in the first blockquote again.

</blockquote>

And here we are back outside of the first blockquote.

<hr>

<h3><a name="lists">6. Lists</a></h3>

Here is an Unordered (bullet) List (<tt><ul>>..&lt/ul></tt>):

<ul>
<li>This is a List Item (<tt><li></tt>).
<li>This is another item.
<li>This is yet another item.
</ul>

Here is an Ordered (numbered) List (<tt><ol>>..&lt/ol></tt>):

<ol>
<li>This is a List Item (<tt><li></tt>).
<li>This is another item.
<li>This is yet another item.
</ol>

And here is a Description List (<tt><dl></tt>).
using Kermit commands as an example:

<dl>

<dt><tt>SET FILE TYPE BINARY</tt>

<dd>This command tells Kermit to transfer files in binary mode. In other
words, don't mess with the file, just send it as-is. The result on the
receiving computer should be identical to the original.

<dd>This command tells Kermit to transfer files in text mode. This should be
used with plain-text files, especially when transferring them between
computers with different file formats or operating systems, such as VMS and
Unix, or Unix and Windows. It converts the file's format and character-set
(if necessary) so the received file is usable on the destination computer.

</dl>

You can have lists within lists:

<ol>
<li>A gromet
<li>A widget
<li>A framus, which consists of the following components:
<ul>
<li>A doohickey.
<li>A veeblefetzer -- these come in several colors:
<ol>
<li>Purple
<li>Purple
<li>Purple
</ol>
<li>A whatchamacallit.
</ul>
<li>A doodad.
</ol>

And you can have ordered lists that use letters instead of numbers:

<ol type="a">
<li>Pennies
<li>Nickels
<li>Dimes
<li>Quarters
</ol>

<hr>

<h3><a name="links">7. Links</a></h3>

Links can be internal within a Web page (like to
the <a href="#contents">Table of Contents</a> at the top), or they
can be to external web pages or pictures on the same website, or they
can be to websites, pages, or pictures anywhere else in the world.

Here is a link to the <a href="http://www.columbia.edu/kermit/">Kermit
Project home page</a>.

Here is a link to <a href="#lists">Section 5</a> of this document.

Here is a link to
<a href="http://www.columbia.edu/kermit/ckuins.html#x4.0">Section 4.0</a>
of the <a href="http://www.columbia.edu/kermit/ckuins.html">C-Kermit
for Unix Installation Instructions</a>.

Here is a link to a picture:
<a href="picture-of-something.jpg">CLICK HERE</a> to see it.

<hr>

<h3><a name="tables">8. Tables</a></h3>

Here's a simple table with some headings and a few rows:

<table>
<tr> 
<th>Heading A 
<th>Heading B
<th>Heading C
<tr> 
<td>Cell 1A
<td>Cell 1B
<td>Cell 1C
<tr> 
<td>Cell 2A
<td>Cell 2B
<td>Cell 2C
<tr> 
<td>Cell 3A
<td>Cell 3B
<td>Cell 3C
</table>

</blockquote>

Same table again but with borders:

<table border>
<tr> 
<th>Heading A 
<th>Heading B
<th>Heading C
<tr>
<td>Cell 1A
<td>Cell 1B
<td>Cell 1C
<tr>
<td>Cell 2A
<td>Cell 2B
<td>Cell 2C
<tr>
<td>Cell 3A
<td>Cell 3B
<td>Cell 3C
</table>

</blockquote>

And again but with Column C right-adjusted:

<table border>
<tr> 
<th>Heading A 
<th>Heading B
<th>Heading C
<tr>
<td>Cell 1A
<td>Cell 1B
<td align="right">Cell 1C
<tr>
<td>Cell 2A
<td>Cell 2B
<td align="right">Cell 2C
<tr>
<td>Cell 3A
<td>Cell 3B
<td align="right">Cell 3C
</table>

</blockquote>

<hr>
<h3><a name="install">9. Installing Your Web Page on the Internet</a></h3>

How to put your web page on the Internet depends on your Internet Service
Provider (ISP). At Columbia University, each user has a "shell account" on
the central server, which runs a Unix-based operating system, and which you
can access with a Telnet, SSH, or modem program such as <a
href="http://www.columbia.edu/kermit/">Kermit</a>. Here's an example that
applies to Columbia University's web server, showing how to upload your
files from Windows:

There are easier ways to do this than what I describe below, but they
require add-on software. The following method should work for everybody
who has Windows and an Internet connection.

</blockquote>

If you create a <tt>public_html</tt> subdirectory of your login directory,
give it world read and search permission, and then create an
<tt>index.html</tt> file in that directory and give it world read
permission, you'll have a home page. In this example "<tt>$</tt>" is the
shell prompt (yours might be different), and what you type is underlined.
CAUTION: the directory name is <tt>public_html</tt> but the underscore might
be obscured the underline in the examples below. Whenenever typing
"<tt>public_html</tt>" always include the underscore.

<blockquote>
<pre>
$ cd (Change to your login directory)
$ mkdir public_html (Create public_html subdirectory)
$ chmod 755 public_html (Give it world read/search permission)
$ cd public_html (Enter the public_html subdirectory)
</pre>
</blockquote>

You only have to do this part once.

Let's assume you have created a website in the Web folder on your PC.
Here's an example of how to upload your Web files to your <tt>public_html</tt>
directory on Columbia University's
Cunix server using FTP (File Transfer Protocol).
First start the FTP program:

<blockquote>
Start <tt>-></tt> Run
</blockquote>

and type "ftp" in the box. An FTP window opens and an "<tt>ftp></tt>"
prompt appears. Type the underlined commands at the "<tt>ftp></tt>"
prompt (substituting your own user ID, etc):

ftp> lcd Desktop
Local directory now C:Documents and SettingsolgaDesktop.
ftp> lcd Web
Local directory now C:Documents and SettingsolgaDesktopWeb.
ftp> open cunix
Connected to cunix.cc.columbia.edu.
220 Cunix FTP server (Version 5.60) ready.
User (cunix.cc.columbia.edu:(none)): olga
331 Password required for olga.
Password: (type your password here)
230 User olga logged in.
ftp> cd public_html (That's "public_html" in case you can't see the underscore)
ftp> binary
ftp> put index.html
200 PORT command successful.
150 Opening ASCII mode data connection for index.html.
226 Transfer complete.
ftp: 285 bytes sent in 0.00Seconds 285000.00Kbytes/sec.
ftp> site chmod 664 index.html
200 CHMOD command successful
ftp> bye
</pre>
</blockquote>

This sends the <tt>index.html</tt> file to your <tt>public_html</tt>
directory on the server. You can send any other file by subsituting its
name for "<tt>put index.html</tt>. If you want to send all the files in
your Web folder, replace "<tt>put index.html</tt> with "<tt>put *</tt>"
(asterisk, meaning "all files" in this directory). Always use binary mode
unless you know what you're doing.

If the "site chmod" command failed (this service is not supported by some
FTP servers), you have one more step. Before others can see your web files,
you have to give them "world read" permission. Again, log in to the server
using a terminal emulator (Telnet, SSH, Kermit, whatever), and:

<blockquote>
<pre>
$ cd ~/public_html (Enter the public_html subdirectory)
$ chmod 664 * (Make all files publically readable)
</pre>
</blockquote>

Now you have a home page. If you were at Columbia and your login ID was
"olga", the address (URL) of your home page would be:

<blockquote>
<a href="http://www.columbia.edu/~olga/"><tt>http://www.columbia.edu/~olga/</tt></a>
</blockquote>

If you want to add pictures to your Web page, you can upload those too (also
with Kermit or FTP), and you also have to "chmod 664" all the files to make
them readable by everybody. Every time you add new files to your
<tt>public_html</tt> directory, you have to "chmod 664" them so they
are accessible, either in the FTP session itself (as shown previously), or
by logging in to the host and:

<blockquote>
<pre>
$ cd ~/public_html (That's "public_html" in case you can't see the underscore)
$ chmod 664 *
</pre>
</blockquote>

Pictures should be in JPG or GIF format. To include a picture ("image")
in your page, include a statement like this at the desired spot:

Replace filename by the name of the file (e.g. <tt>skyline.jpg</tt>).
You can omit or experiment with the <tt>width=</tt> clause. 100% means
"make the picture the same width as the browser window."

Now you have your own home page on the Web, and your own URL (Uniform
Resource Locator, or Web address). In this example, the URL is:

<blockquote>
<a href="http://www.columbia.edu/~olga/"><tt>http://www.columbia.edu/~olga/</tt></a>
</blockquote>

Of course, if you prefer, you can also do all the Web-page editing directly
on the server, using an a server-based text editor like EMACS, Pico, or Vi
while logged in to the Unix shell. In that case you don't need to upload
anything (except maybe photos), but then you also need to be more familiar
with the server's Unix environment and commands and utilities.

<hr>
<h3><a name="more">10. Where to go from here</a></h3>

Most Web pages are created by hideous bloated "Web Authoring" tools, which are
designed to force readers to use a Web browser (such as IE) that is made by the
same company that made the Web-authoring tool (e.g. Front Page). If all you
want is text with some pictures and links and maybe some tables, as opposed to
spinning blinking popup holograms with streaming video and sound effects, it's
best to keep it simple and do it yourself. This is how the Web started off in
the HTML 1.0 days of the early 1990s. The ingenious thing was that it was
self propogating. If you saw a web page with a certain effect and wanted to
know how it was done, you could simply "view source" to get the "source code"
and then adapt it to your own page. You can still do that with pages that
look like this one, but since most Web pages are no longer made by hand,
you'll often see tons of incomprehensible gibberish (the more special effects,
the more gibberish).

If you have mastered the simple techniques shown in this page, you know the
basics. Which is more than can be said of many "web designers" who only
know how to use prepackaged software to create web pages by picking things
from menus and moving things around with a mouse.

To learn more, follow these links:

<ul>
<li>The
<a href="<a href="http://www.w3.org/TR/REC-html40/cover.html#minitoc">HTML
4.01 specification</a>

<li>You can check the validity of your web page
at the <a href="http://validator.w3.org/">W3C Markup Validation Service</a>.

<li>You can find lots more Web pages in the same simple style as this
one at the <a href="http://www.columbia.edu/kermit/">Kermit Project</a>
website.

</ul>

Don't worry that the HTML 4.01 specification says that everything from HTML
1.0 is "deprecated" and we're supposed to be using XHTML or XML and
"cascading style sheets" or whatever. They're not allowed to take the
original simple HTML syntax away.

If your web pages doesn't look the way you expected, try using the <a
href="http://validator.w3.org/">Validation Service</a>. If you have errors
in it, this will tell you what they are. The most common errors are
unclosed environments (such as <tt><blockquote></tt> without a
matching <tt></blockquote></tt>) and missing doublequotes inside
commands, e.g.:

<blockquote>
<pre>
<a href="http://www.columbia.edu/kermit&gt; </pre> </blockquote> which must be: <blockquote> <pre> &lt;a href="http://www.columbia.edu/kermit">
</pre>
</blockquote>

For more about "special characters" and character sets, see:

<ul>
<li><a href="entities.html">HTML 4 Symbolic Character Entities</a>
<li>A <a href="http://www.columbia.edu/kermit/utf8-t1.html">Unicode 4.0 Table
</a> (all but Chinese, Japanese, and Korean)
<li>More <a href="http://www.columbia.edu/kermit/csettables.html">character
set tables</a>
<li>A <a href="http://www.columbia.edu/kermit/utf8.html">UTF-8 sampler</a>
(text in many languages)
<li><a href="http://www.unicode.org/charts/">Unicode Character Charts</a>
(official)
</ul>

(End)

<hr>
</body> 
</html>

Explanation / Answer

file.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>

<title>Sample Web Page</title>
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="style.css" >
</head>
<body bgcolor="#ffffff" text="#000000">
<h2>Sample Web Page</h2>

<img src="picture-of-something.jpg" alt="Brief description" width="100%"> 
A random photo, maximize your browser to enlarge.

<a href="http://www.columbia.edu/~fdc/">Frank da Cruz</a> 
Sat Jan 17 12:07:32 2004

<h3><a name="contents">CONTENTS</a></h3>

</ol>

<hr>

<h3><a name="basics">1. Creating a Web Page</a></h3>
<section id="first">
This page was typed by hand. Anybody can do this, you don't need any
special "web creation" tools or HTML editors, and the pages you make can be
viewed from any browser. To see how this page was made, choose
View Source (or View Page Source, or View Document Source) in your
browser's menu. A simple web page like this one is just plain text with
HTML commands (markup) mixed in. HTML commands themselves are plain text.

<dl>
<dt>Example for Windows:

</dl>

</section>
<hr>
<h3><a name="syntax">2. HTML Syntax</a></h3>