webfile 2.0

download webfile 2.0

of 19

Transcript of webfile 2.0

  • 8/18/2019 webfile 2.0

    1/19

    EXPERIMENT-4

    Use of MARQUEE and BLINK Tags

    1.)

    An HTML marquee is a scrolling piece of text displayed either horizontally across or vertically

    down your webpage depending on the settings. This is created by using HTML marquees! tag.

    2.)

    The HTML blin"! tag is used to enclose a text to ma"e it blin". This tag was supported by

     #etscape and now this is obsolete.

    !"E-1

    html!

    head!

    title!$A%M' (A)*+,-/0,1/2345title!

    5head!

    body!

    marquee!TH&% &% A# '6AM7L' 89 MA*:)'';;;;;;;;5marquee!

    5body!

    5html!

  • 8/18/2019 webfile 2.0

    2/19

    !"E-2 tag

    html!

    H'A

    title!$A%M' (A)*+,-/0,1/2345title!

    5H'A

    body!

    p!

    hr!

    =L( TA> )%'< H'*'

    marquee!TH&% &% A# '6AM7L' 89 MA*:)''5marquee!

    blin"!TH&% &% A# '6AM7L' 89 =L(5blin"!

    5p!

    5body!

    5html!

  • 8/18/2019 webfile 2.0

    3/19

  • 8/18/2019 webfile 2.0

    4/19

    EXPERIMENT-#

    LI$T$

    Tags Used-

    1.)

    The HTML ol! tag is used for creating an ordered list.An unordered list starts with

    the  tag. 'ach list item starts with the title!$A%M' (A)*+,-/0,1/2345title!

    5H'A

    body!

    hr!

    =L( TA> )%'< H'*'

    marquee!TH&% &% A# '6AM7L' 89 MA*:)''5marquee!

    blin"!TH&% &% A# '6AM7L' 89 =L(5blin"!

    ol!

    http://www.w3schools.com/tags/tag_li.asphttp://www.w3schools.com/tags/tag_li.asp

  • 8/18/2019 webfile 2.0

    5/19

    li!9*)&T%

    ul!

    li!A77L'

    li!MA#>8

    5ul!

    li!@8M7)T'*%

    ul!li!

  • 8/18/2019 webfile 2.0

    6/19

    LINK$ In*e+ ,eage / In*+a ,eage0

    Tags Used-

    1.)

    The a! tag defines a hyperlin" which is used to lin" from one page to another.

    The most important attribute of the a! element is the href attribute which indicates the lin"Bs

    destination.

    =y default lin"s will appear as follows in all browsers?

    • An unvisited lin" is underlined and blue

    • A visited lin" is underlined and purple

    • An active lin" is underlined and red

    2.) title!$A%M' (A)*+,-/0,1/2345title!

    5H'A

    body!

    p!hr!

    h2!L(% '6AM7L'5h2!

    L(%

  • 8/18/2019 webfile 2.0

    7/19

    a hrefCDhttp?55www.>88>L'.comD!Eisit >88>L';;;;;;;5a!

    5p!5body!

    5html!

    !"E-2 In*+a %'n'ng

    html!

    H'A

    title!$A%M' (A)*+,-/0,1/2345title!

    5H'A

    body!

    p!

    hr!

    h2!T*AL( '6AM7L'5h2!

  • 8/18/2019 webfile 2.0

    8/19

    p!a hrefCDF7A*A>*A7HD!>o to the 7aragraph5a!5p!

    h2!Gelcome5h2!

    p!This paragraph welcomes you.5p!

    h1!About5h1!

    p!i!b!@loud computing5b!5i! also "nown as Bondemand computingB is a "ind of

    &nternetbased computing where shared resources data and information are provided tocomputers and other devices ondemand. &t is a model for enabling ubiquitous ondemand

    access to a shared pool of configurable computing resources. @loud computing and storage

    solutions provide users and enterprises with various capabilities to store and process their data inthirdparty data centers. &t relies on sharing of resources to achieve coherence and economies of

    scale similar to a utility +li"e the electricity grid4 over a networ". At the foundation of cloud

    computing is the broader concept of converged infrastructure and shared services. 5p!

    h1!a nameCD7A*A>*A7HD!7A*A>*A7H5a!5h1!

    p!This is the section your lin" will go to.5p!

    5body!

    5html!

  • 8/18/2019 webfile 2.0

    9/19

    EXPERIMENT-

    3o+'ng ,'* Med'a '5age6 a&d'o / 7'deo0

    Tags &sed-

    1.)  tag.

    The img! tag is empty it contains attributes only and does not have a closing tag.

    The alt Attribute

    The alt attribute specifies an alternate text for an image if the image cannot be displayed.

    The alt attribute provides alternative information for an image if a user for some reason cannotview it +because of slow connection an error in the src attribute or if the user uses a screen

    reader4.

    &mage %ize Gidth and Height

    Iou can use the s*8%e attribute to specify the width and height of an image.

    2.)

    To show a video in HTML use the 

  • 8/18/2019 webfile 2.0

    10/19

    Text between the video! and 5video! tags will only display in browsers that do not support the

    video! element.

    Multiple  elements can lin" to different video files. The browser will use the firstrecognized format.

    !"E-1 IMA;E0

    html!

    title!$A%M' (A)*+,-/0,1/2345title!

    body!

    p!

    hr!

    h2!&MA>' )%A>'5h2!

    h1!&M> TA> )%'

  • 8/18/2019 webfile 2.0

    11/19

    !"E-2 AU"I!0

    html!

    title!$A%M' (A)*+,-/0,1/2345title!

    body!

    p!

    hr!

    h2!A)

  • 8/18/2019 webfile 2.0

    12/19

    html!

    title!$A%M' (A)*+,-/0,1/2345title!

    body!

    p!

    hr!

    h2!E&

  • 8/18/2019 webfile 2.0

    13/19

    EXPERIMENT-=

    RAME$

    Tags Used

    1.)

    The frameset! tag defines a frameset.

    The frameset! element holds one or more frame! elements. 'ach frame! element can hold a

    separate document.

    The frameset! element specifies H8G MA#I columns or rows there will be in the frameset

    and H8G M)@H percentage5pixels of space will occupy each of them.

    HTML frames are used to divide your browser window into multiple sections where each section

    can load a separate HTML document. A collection of frames in the browser window is "nown as

    a frameset. The window is divided into frames in a similar way the tables are organized? into

    rows and columns.

    +ea*'ng +a5es

    To use frames on a page we use frameset! tag instead of body! tag. The frameset! tag

    defines how to divide the window into frames. The +o,sattribute of frameset! tag defines

    horizontal frames and 9o%s attribute defines vertical frames. 'ach frame is indicated by frame!

    tag and it defines which HTML document shall open into the frame.

     The Tag Attributes

    9ollowing are important attributes of the frameset! tag?

    A**+'&*e "es9+'*'on

    cols specifies how many columns are contained in the frameset and the size of

    each column. Iou can specify the width of each column in one of four

    ways?

    http://www.w3schools.com/tags/tag_frame.asphttp://www.w3schools.com/tags/tag_frame.asphttp://www.w3schools.com/tags/tag_frame.asp

  • 8/18/2019 webfile 2.0

    14/19

    rows This attribute wor"s Just li"e the cols attribute and ta"es the same values

     but it is used to specify the rows in the frameset. 9or example to create two

    horizontal frames use rows="10%, 90%" . Iou can specify the height of

    each row in the same way as explained above for columns.

     border This attribute specifies the width of the border of each frame in pixels. 9or

    example borderCDD. A value of zero means no border.

    frameborder This attribute specifies whether a threedimensional border should be

    displayed between frames. This attrubute ta"es value either 2 +yes4 or ,

    +no4. 9or example frameborderCD,D specifies no border.

    framespacin

    g

    This attribute specifies the amount of space between frames in a frameset.

    This can ta"e any integer value. 9or example framespacingCD2,D meansthere should be 2, pixels spacing between each frames.

    !"E-1

    html!

    H'A

    title!$A%M' (A)*+,-/0,1/2345title!

    frameset rowsCD20-D!

    frame srcCD2.htmlD nameCD9*AM' 2D!

    frameset colsCD,,D!

    frame srcCDleft.htmlD nameCD9*AM' 1D!

    frame srcCDright.htmlD nameCD9*AM' 3D!

    5frameset!

    5frameset!

    5html!

  • 8/18/2019 webfile 2.0

    15/19

    1.html 

    html!

    title! $A%M' (A)* ,-/0,1/23 5title!

    body!

    p!

    h2! 9*AM' 2 5h2!

    5p!

    5body!

    5html!

    left.html html!

    title! $A%M' (A)* ,-/0,1/23 5title!

    body!

    p!

    h1! 9*AM' 1 5h1!

    5p!

    5body!

    5html!

    right.html 

    html!

    title! $A%M' (A)* ,-/0,1/23 5title!

    body!

    p!

    h3! 9*AM' 3 5h3!

    5p!

    5body!

    5html!

  • 8/18/2019 webfile 2.0

    16/19

  • 8/18/2019 webfile 2.0

    17/19

    EXPERIMENT-?

    TABLE$

    The HTML tables allow web authors to arrange data li"e text images lin"s other tables etc.

    into rows and columns of cells.

    The HTML tables are created using the  tag in which the  tag is used to create table

    rows and  tag is used to create data cells.

    Here o+de+ is an attribute of table! tag and it is used to put a border across all the cells. &f 

    you do not need a border then you can use borderCD,D.

     Table Heading

    Table heading can be defined using  tag. This tag will be put to replace td! tag which isused to represent actual data cell. #ormally you will put your top row as table heading as shown

     below otherwise you can use th! element in any row.

    Cellpadding and Cellspacing Attributes

    There are two attribiutes called cellpadding  and cellspacing  which you will use to adJust the

    white space in your table cells. The cellspacing attribute defines the width of the border while

    cellpadding represents the distance between cell borders and the content within a cell.

    Colspan and Rowspan Attributes

    Iou will use 9o%san attribute if you want to merge two or more columns into a single column.

    %imilar way you will use +o,san if you want to merge two or more rows.

     Tables Backgrounds

    Iou can set table bac"ground using one of the following two ways?

    • g9o%o+ attribute Iou can set bac"ground color for whole table or Just for one cell.

     Table Height and Width

    Iou can set a table width and height using ,'d* and e'g* attrubutes. Iou can specify table

    width or height in terms of pixels or in terms of percentage of available screen area.

     Table Caption

  • 8/18/2019 webfile 2.0

    18/19

    The 9a*'on tag will serve as a title or explanation for the table and it shows up at the top of the

    table. This tag is deprecated in newer version of HTML56HTML.

    @8title!$A%M' (A)*+,-/0,1/2345title!

    5H'A

    body!

    table borderCD2D bordercolorCDgreenD bgcolorCDyellowD widthCD-,,D heightCD2,D!

    caption!TA=L' '6AM7L'5caption!

    tr!

    th!@olumn 25th!

    th!@olumn 15th!

    th!@olumn 35th!

    5tr!

    tr!td rowspanCD1D!*ow 2 @ell 25td!td!*ow 2 @ell 15td!td!*ow 2 @ell 35td!5tr!

    tr!td!*ow 1 @ell 15td!td!*ow 1 @ell 35td!5tr!

    tr!td colspanCD3D!*ow 3 @ell 25td!5tr!

    5table!

    5body!

    5html!

  • 8/18/2019 webfile 2.0

    19/19