Section 15: Web Authoring 
Mark Nicholls – ICT Lounge 
Pa g e | 21 
2.
This will take us to the web 
page͛s HTML code
Setting the text to style p:
Once we have access to the code, we need to surround our line of text (Last edited 
by…) with something called a tag
Tags are used to instruct web browsers how to display  objects on the web page 
(text styles for example). Tags almost always work in pairs with an opening tag <> 
and a closing tag </>. The opening tag tells the browser to start applying the style 
and the closing tag tells it to stop applying the style. 
The tag we need to surround our text with is the <p> </p> (paragraph) tags. 
1.
Position your curser to the left 
of the text 
2.
Type in… <p> 
3.
FrontPage will automatically assume you also want the closing tag </p>
4.
Move the closing tag </p> to 
the end of the text 
Pdf add signature field - C# PDF Form Data fill-in Library: auto fill-in PDF form data in C#.net, ASP.NET, MVC, WinForms, WPF
Online C# Tutorial to Automatically Fill in Field Data to PDF
convert word to pdf fillable form; auto fill pdf form from excel
Pdf add signature field - VB.NET PDF Form Data fill-in library: auto fill-in PDF form data in vb.net, ASP.NET, MVC, WinForms, WPF
VB.NET PDF Form Data fill-in library: auto fill-in PDF form data in vb.net, ASP.NET, MVC, WinForms, WPF
change font pdf fillable form; convert excel to fillable pdf form
Section 15: Web Authoring 
Mark Nicholls – ICT Lounge 
Pa g e | 22 
Checking that the style sheet has applied the correct formatting:
Now that we have surrounded the line of text with the <p> </p> tags, the style 
sheet can apply the formatting that we set up during task 2. 
To see if this has happened we need to go back into Design View to see the effects. 
1.
Click the ͚Design͛ tab 
2.
This will take us back into Design View and you should notice that the style 
sheet has indeed altered the text to match the formatting specified in task 2  
(black, sans-serif, 10 points, left aligned):
Before style was applied 
After style was applied 
C# PDF Digital Signature Library: add, remove, update PDF digital
things. Add a signature or an empty signature field in any PDF file page. Search unsigned signature field in PDF document. Prepare
change font in pdf fillable form; pdf form filler
VB.NET PDF Digital Signature Library: add, remove, update PDF
things. Add a signature or an empty signature field in any PDF file page. Search unsigned signature field in PDF document. Prepare
auto fill pdf form fields; pdf form fill
Section 15: Web Authoring 
Mark Nicholls – ICT Lounge 
Pa g e | 23 
Task 8 – Enter a page heading and set text styles 
Enter the heading Rootrainer Trees. 
Set the text to style h1
Adding the heading: 
Task 8 is almost the same as task 7 apart from different text, different text position 
and a different set of tags: 
1.
Open the HOMEPAGE.htm 
web page file in Design View 
2.
Position your curser under the 
first piece of text 
3.
Type in the required heading 
(Rootrainer Trees) 
Accessing HTML code so we can change style of text: 
1.
Highlight the text and then 
click the ͚ ode͛ tab 
C# PDF insert image Library: insert images into PDF in C#.net, ASP
field. Access to freeware download and online C#.NET class source code. How to insert and add image, picture, digital photo, scanned signature or logo into PDF
adding a signature to a pdf form; converting a word document to a fillable pdf form
VB.NET PDF insert image library: insert images into PDF in vb.net
Import graphic picture, digital photo, signature and logo into PDF Add images to any selected PDF page in VB.NET. Insert images into PDF form field in VB.NET.
acrobat fill in pdf forms; pdf fillable form
Section 15: Web Authoring 
Mark Nicholls – ICT Lounge 
Pa g e | 24 
Setting the text to style h1:
1.
Position your curser to the left 
of the text 
2.
Type in… <h1> 
3.
FrontPage will automatically assume you also want the closing tag </h1>. 
4.
Move the closing tag </h1> to 
the end of the text 
Checking that the style sheet has applied the correct formatting:
Go  back  into design view and check that the correct formatting  has  been  applied 
from the style sheet (dark blue, sans-serif, 36 points, centre aligned, bold)
Before style was applied
After style was applied
How to C#: Basic SDK Concept of XDoc.PDF for .NET
You may add PDF document protection functionality into your C# program. To be specific, you can edit PDF password and digital signature, and set PDF file
create fillable form pdf online; convert pdf file to fillable form online
VB.NET PDF: Basic SDK Concept of XDoc.PDF
You may add PDF document protection functionality into your VB.NET program. To be specific, you can edit PDF password and digital signature, and set PDF file
convert pdf fillable form to word; convert pdf to fillable pdf form
Section 15: Web Authoring 
Mark Nicholls – ICT Lounge 
Pa g e | 25 
Task 9 – Laying out the page with a table 
Below the heading, create a table which has 4 rows and 2 columns. 
Merge the cells to create the table as  
shown to the right: 
Set the cell padding for the table to 3. 
Set the cell spacing for the table to 5 
Set the width of the table to 100% 
Set the table border to 2. 
Set the table background colour to  light yellow. 
9.1
– Creating and formatting a table – How to do it:
Tables are used to provide the layout for a web page. Tables can be formatted  to 
alter row / column numbersbackground colourswidthsborder thickness etc. 
Inserting the table: 
To  insert  a  new  table  you  would  do 
the following: 
1.
Click Table 
2.
Click Insert 
3.
Click Table 
Formatting the table:
1.
In the table properties window you can set 
all of the required table formatting such as: 
Row and column numbers 
Width (in percent) 
Cell Padding / Cell Spacing 
Border size and Background colour 
2.
When you have set the table up correctly 
click OK 
VB.NET PDF Library SDK to view, edit, convert, process PDF file
NET program. Password, digital signature and PDF text, image and page redaction will be used and customized. PDF Annotation Edit.
pdf signature field; pdf fillable forms
C# Create PDF Library SDK to convert PDF from other file formats
you can add some additional information to generated PDF file. What's more, you can also protect created PDF file by adding digital signature (watermark) on
create fillable pdf form; create a pdf with fields to fill in
Section 15: Web Authoring 
Mark Nicholls – ICT Lounge 
Pa g e | 26 
Your table will be inserted into the HOMEPAGE.htm web page: 
Getting back into table properties at a later time:
You can get back into table properties at any time by: 
1.
Right click the table 
2.
Select table properties 
This is useful if you need to correct mistakes or add / 
remove rows and columns. 
9.2
– Merging (joining) table cells – How to do it:
The image in task 9 requires us to merge (or join) some of our cells so that we are 
left with the correct layout.  
C# PDF Convert to Images SDK: Convert PDF to png, gif images in C#
image files including all PDF contents, like watermark and signature in .NET. C#.NET DLLs Solution for Converting Images to PDF in C# Add necessary references:
create a pdf form that can be filled out; create a fillable pdf form
C# PDF remove image library: remove, delete images from PDF in C#.
Support removing vector image, graphic picture, digital photo, scanned signature, logo, etc. Remove Image from PDF Page Using C#. Add necessary references:
convert word doc to fillable pdf form; convert word form to pdf with fillable
Section 15: Web Authoring 
Mark Nicholls – ICT Lounge 
Pa g e | 27 
To merge table cells you should do the following: 
1.
Highlight the cells across the top 
row of the table 
2.
Right click anywhere in the 
highlighted section 
3.
Select Merge Cells 
4.
Repeat for the other sections that require merging. Your table should look like 
this when you are finished: 
Section 15: Web Authoring 
Mark Nicholls – ICT Lounge 
Pa g e | 28 
9.3
– Resizing columns and rows – How to do it:
Table columns and rows can be resized to help layout the page exactly. In the image 
on task 9, cell D was wider than cells B and C. 
To resize columns / rows you should do the following: 
1.
Click the border of the row / column and hold the mouse button down 
2.
Drag the border to the size you want 
3.
Your table should look like this when you are finished: 
Section 15: Web Authoring 
Mark Nicholls – ICT Lounge 
Pa g e | 29 
Task 10 – Importing an image 
Import the image SPECIMEN4.GIF and place it in cell D 
Set the height to 250 pixels and maintain the aspect ratio 
Make sure that the whole image is visible.  
10.1 – Importing and Resizing images – How to do it:
Inserting / Importing images in FrontPage is very easy. You just have to make sure 
that you have the image on your computer, ready to import. You SHOULD NOT try 
to copy and paste images in FrontPage. 
Importing the image: 
To insert an image into FrontPage you would do the following: 
1.
Position your mouse curser into the location 
where you want the image to appear  
(cell D in the table) 
2.
Click Insert 
3.
Click Picture 
4.
Click From File…  
5.
Browse to the folder we created 
in task 1 (Downloaded Files)
6.
Click on the SPECIMEN4.GIF 
image 
7.
Click Insert 
8.
The image will be inserted into 
cell D 
Section 15: Web Authoring 
Mark Nicholls – ICT Lounge 
Pa g e | 30 
Resizing the image: 
When  an  examination  question  asks  you  to  resize  an  image  it  will  also  specify 
whether or not you should maintain aspect ratio. 
Maintaining Aspect Ratio 
Resizing the image whilst keeping the correct dimensions 
Not Maintaining Aspect Ratio 
Resizing the image whilst distorting the dimensions 
The task wants us to resize the image to 250 pixels high and maintain aspect ratio. 
To do this you should: 
1.
Right click the image 
2.
Select Picture Properties…  
3.
Find the Size section 
4.
Make sure the Keep aspect ratio box is 
ticked 
5.
Set the height of the image to 250 pixels 
6.
Click OK 
Image in correct 
proportions 
Image 
distorted 
NOTE:
If you needed to distort the image for any reason you would simply uncheck the Keep aspect 
ratio box before setting a new height. 
Documents you may be interested
Documents you may be interested