HTML and DHTML Questions
HTML and DHTML Questions
HTML and DHTML Questions
1. Submit alert
<form>
<input type="button" onclick="alert('Are you sure you want to give us the deed to your house?')"
value="Confirmation Alert"></form>
<html>
<head>
<script type="text/javascript">
<!--
function confirmation() {
var answer = confirm("Leave tizag.com?")
if (answer){
alert("Bye bye!")
window.location = "http://www.google.com/";
}
else{
alert("Thanks for sticking around!")
}
}
//-->
</script>
</head>
<body>
<form>
<input type="button" onclick="confirmation()" value="Leave Tizag.com">
</form>
</body>
</html>
<html>
<head>
<script type="text/javascript">
<!--
function delayer(){
window.location = "../javascriptredirect.php"
}
//-->
</script>
</head>
<body onLoad="setTimeout('delayer()', 5000)">
<h2 >Prepare to be redirected!</h2>
<p>This page is a time delay redirect, please update your bookmarks to our new location!</p>
</body>
</html>
4. What is shtml?
A. secure html is shtml (serverside(ssl)
6. What is Dhtml?
A. if any website using html, JavaScript&CSS that is Dhtml.
9. How can you have different number of cells for each row of a table?
A. By using the COLSPAN attribute of the <TD> tag.
Example:
<TABLE>
<TR>
<TD>Column 1</TD>
<TD>Comumn 2</TD>
</TR>
<TR>
<TD COLSPAN = "2">Column1 & Column 2</TD>
</TR>
</TABLE>
<FRAMESET cols="33%,33%,33%">
<FRAMESET rows="*,200">
<FRAME src="contents_of_frame1.html">
<FRAME src="contents_of_frame2.gif">
</FRAMESET>
<FRAME src="contents_of_frame3.html">
</FORM>
12. Is there a way to get indexed better by the search engines?
A. Mention Meta tag inside of head tag.
16. What are the three tags of a form tag in HTML form?
A. A <form> tag has three attributes:
1. Method 2. Action 3. Enctype
We can get the file name. Now, we can take this file from Temporary Internet Files folder in our system.
While we visit or browse a site all file are stored in Temporary Internet Files, from this folder we can take all the files.
2. Second method is by using some swf catcher (like Sothink Swf Catcher) software’s we can download the file.
By using these methods only ill download the Flash object.
20. What is the difference between the CLASS and ID when you are writting CSS?
A. ID: In CSS we can call id with '#' and can be used only one time For one page.
Class: When coming to the case of class in CSS it can Be used infinite number of times in the same page
as well as In the whole site.
A JavaScript could use "history.back()" to do this, but this only works in Netscape 2.
Of course, an image cannot be wrapped, so you have to be careful with that. It seems that 400 or 500 pixels is a
reasonable width; anything above 600 will mean a certain percentage of users will have to scroll to see the rightmost
bit. This percentage increases with your image width. Keep in mind that not everyone runs his browser at full screen!
An alternative is to use <DL> without <DT> and <DD>, which is invalid HTML, but several browsers work around this
error by indenting the text inside it. This is not guaranteed to work. If you are willing to use tables for layout purposes,
there is another option. Create a one-cell table, as follows:
<CENTER>
<TABLE width="805px">
<TR><TD><DIV align=left>
<!-- The text goes here -->
</DIV>
</TD></TR>
</TABLE>
</CENTER>
A drawback to this solution is that very long blocks inside a table may take a while to download and may not appear
until the entire table has been downloaded. Another drawback is that it may force users to resize their viewing window
after they have become accustomed to their preferred settings.
The file is linked with HTML documents via the LINK element inside the HEAD element. Files containing style information
must have extension .css, e.g. style.css.
<HEAD>
<LINK REL=STYLESHEET HREF="style.css" TYPE="text/css">
</HEAD>
To import a style sheet or style sheets include the @import notation or notations in the STYLE element. The @import
notations must come before any other declaration. If more than one sheet is imported they will cascade in order they are
imported - the last imported sheet will override the next last; the next last will override the second last, and so on. If the
imported style is in conflict with the rules declared in the main sheet then it will be overridden.
42.What is selector?
A. CSS selector is equivalent of HTML element(s). It is a string identifying to which element(s) the corresponding
declaration(s) will apply and as such the link between the HTML document and the style sheet.
For example in
P {text-indent: 10pt}
the selector is P and is called type selector as it matches all instances of this element type in the document.
in P, UL {text-indent: 10pt} the selector is P and UL (see grouping); in .class {text-indent: 10pt} the selector is .class (see
class selector).
Table of Contents
44. What is ID selector?
A. ID selector is an individually identified (named) selector to which a specific style is declared. Using the ID attribute
the declared style can then be associated with one and only one HTML element per document as to differentiate it from
all other elements. ID selectors are created by a character # followed by the selector's name. The name can contain
characters a-z, A-Z, digits 0-9, period, hyphen, escaped characters, Unicode characters 161-255, as well as any Unicode
character as a numeric code, however, they cannot start with a dash or a digit.
In the example above the background property has increased weight while the color property has normal.
H1 {font-weight: bold;
font-style: italic;
font-variant: small-caps;
font-size: 160%;
font-family: serif}
Note: To make things even simpler the line-height property can be specified together with the font-size property:
H1 {font: bold italic small-caps 160%/170% serif}
51. What is value?
A. Value is a 'physical' characteristic of the property. Property declares what should be formatted, e.g. FONT while value
suggests how the property should be formatted, e.g. 12pt. By setting the value 12pt to the property FONT it is suggested
that the formatted text be displayed in a 12 point font. There must always be a corresponding property to each value or
set of values.
1) The rule P {color: red} will display red text in all paragraphs. By classifying the selector P different style can be
attached to each class allowing the display of some
paragraphs in one style and some other paragraphs in another style.
2) A class can also be specified without associating a specific element to it and then attached to any element which is to
be styled in accordance with it's declaration.
All elements to which a specific class is attached will have the same style.
To classify an element add a period to the selector followed by an unique name. The name can contain characters a-z, A-
Z, digits 0-9, period, hyphen, escaped characters,
Unicode characters 161-255, as well as any Unicode character as a numeric code, however, they cannot start with a dash
or a digit.
(Note: in HTML the value of the CLASS attribute can contain more characters). (Note: text between /* and */ are my
comments).
CSS
P.name1 {color: red} /* one class of P selector */
P.name2 {color: blue} /* another class of P selector */
.name3 {color: green} /* can be attached to any element */
HTML
<P class=name1>This paragraph will be red</P>
<P class=name2>This paragraph will be blue</P>
<P class=name3>This paragraph will be green</P>
<LI class=name3>This list item will be green</LI>
It is a good practice to name classes according to their function than their appearance; e.g. P.fotnote and not P.green. In
CSS1 only one class can be attached to a selector.
CSS2 allows attaching more classes, e.g.:
P.name1.name2.name3 {declaration} <P class="name1 name2 name2">This paragraph has three classes attached</P>
55. What is grouping?
A. Grouping is gathering
(1) into a comma separated list two or more selectors that share the same style or
(2) into a semicolon separated list two or more declarations that are attached to the same selector (2).
1. The selectors LI, P with class name .first and class .footnote share the same style, e.g.:
LI {font-style: italic}
P.first {font-style: italic}
.footnote {font-style: italic}
To reduce the size of style sheets and also save some typing time they can all be grouped in one list.
2. The declarations {font-style: italic} and {color: red} can be attached to one selector, e.g.:
H2 {font-style: italic}
H2 {color: red}
And can also be grouped into one list:
P:first-line
H1:first-letter
First-line pseudo-element allows sub-parting the element's first line and attaching specific style exclusively to this sub-
part; e.g.:
<P class=initial>The first line of this paragraph will be displayed in uppercase letters</P>
First-letter pseudo-element allows sub-parting the element's first letter and attaching specific style exclusively to this sub-
part; e.g.:
<P class=initial>The first letter of this paragraph will be displayed in red and twice as large as the remaining
letters</P>
<A CLASS=foot HREF....>This anchor and all other anchors with CLASS foot will be displayed as declared above</A>
58. What is cascade?
A. Cascade is a method of defining the weight (importance) of individual styling rules thus allowing conflicting rules to be
sorted out should such rules apply
to the same selector.
Declarations with increased weight take precedence over declaration with normal weight:
1. Find all declarations that apply to a specific selector/property And Declare the specified style if the selector matches
the element if there isn't any Let the element inherit its parent property if there isn't any Use initial value
2. Sort by weight (! important) Increased weight take precedence over normal weight
3.Sort by origin Rules with normal weight declared in author's style sheet will override rules with normal weight
declared in user's personal style sheets Rules with increased weight declared in user's personal style sheet will override
rules with normal weight declared in author's style sheet Rules with increased weight declared in author's style sheet will
override rules with increased weight declared in user's personal style sheets Author's and user's rules will override UA's
default style sheet.
4. Sort by selector's specificity More specific selector will override less specific one:
60. What are inline, block, parent, children, replaced and floating elements?
A. Inline
elements which do not have line breaks. Can occur in block elements or other inline elements, cannot contain block
elements.
Inline elements in HTML 3.2; EM, STRONG, DFN, CODE, SAMP, KBD, VAR, CITE, TT, I, B, U, STRIKE, BIG, SMALL, SUB,
SUP, A, IMG, APPLET, FONT, BASEFONT, BR,
SCRIPT, MAP, INPUT, SELECT, TEXTAREA.
Inline elements in HTML 4.0; EM, STRONG, DFN, CODE, SAMP, KBD, VAR, CITE, ABBR, ACRONYM, TT, I, B, BIG,
SMALL, SUB, SUP, A, IMG, OBJECT, BR, SCRIPT, MAP,
Q, SPAN, BDO, INPUT, SELECT, TEXTAREA, LABEL, BUTTON, (INS, DEL).
Inline elements in HTML 4.0 Transitional; EM, STRONG, DFN, CODE, SAMP, KBD, VAR, CITE, ABBR, ACRONYM, TT, I,
B, U, S, STRIKE, BIG, SMALL, SUB, SUP, A, IMG,
APPLET, OBJECT, FONT, BASEFONT, BR, SCRIPT, MAP, Q, SPAN, BDO, IFRAME, INPUT, SELECT, TEXTAREA, LABEL,
BUTTON, (INS, DEL).
Block
elements which do have line breaks. May occur in other block elements, cannot occur in inline elements, may contain
both block and inline elements.
Block elements in HTML 3.2; H1, H2, H3, H4, H5, H6, ADDRESS, P, DL, DT, DD, UL, OL, DIR, MENU, LI, DIV, CENTER,
BLOCKQUOTE, PRE, HR, ISINDEX, TABLE, FORM.
Block elements in HTML 4.0; P, H1, H2, H3, H4, H5, H6, UL, OL, PRE, DL, DIV, NOSCRIPT, BLOCKQUOTE, FORM, HR,
TABLE, FIELDSET, ADDRESS, (INS, DEL).
Block elements in HTML 4.0 Transitional; P, H1, H2, H3, H4, H5, H6, UL, OL, DIR, MENU, PRE, DL, DIV, CENTER,
NOSCRIPT, NOFRAMES, BLOCKQUOTE, FORM, ISINDEX, HR,
TABLE, FIELDSET, ADDRESS, (INS, DEL).
Parents and children elements which either contain (parents) or are in the content of (children) other elements, e.g.
<P>text<STRONG>text</STRONG>text</P>. P is a parent of STRONG. STRONG is a child of P. If not specified
otherwise, children will inherit parent's properties. NOTE: not all properties are inherited. For more information, see
INHERITANCE. Replaced elements which content is replaced. For example content of the IMG element is replaced with an
image, content of the INPUT element is replace with a field. Floating elements which follow the flow of a parent - inline
elements.
By letting the children inherit their parents a default style can be created for top level elements and their children. (Note:
not all properties can be inherited). The inheritance starts at the oldest ancestor and is passed on to its children and then
their children and the children's children and so on.
Inherited style can be overridden by declaring specific style to child element. For example if the EM element is not to
inherit its parent P then own style must be declared to it.
For example:
All text except for the level 1 heading will be displayed in a 10 point font. H1 will be displayed in a 14 point font (or in a
font that is 80% larger than the one set to BODY).If the element H1 contains other elements, e.g. EM then the EM
element will also be displayed in a 14 point font (or 180%) it will inherit the property of the parent H1. If the EM element
is to be displayed in some other font then own font properties must be declared to it, e.g:
The EM element will be displayed in a 15 point font or will be 10% larger than H1. NOTE: EM is, in this example, inside
H1 therefore will inherit H1's properties and not BODY's.
The above declaration will display all EM elements in 15 point font or font that is 10% larger than font declared to the
parent element. If this specific font is to apply to EM elements but only if they are inside H1 and not every occurrence of
EM then EM must take a form of a contextual selector.
In the example above EM is a contextual selector. It will be displayed in specified font only if it will be found in the
context of H1.
Not all properties are inherited. One such property is background. However, since it's initial value is transparent the
background of the parent element will shine through by default unless it is explicitly set.
/* This is a CSS-comment */
65. Can Style Sheets and HTML stylistic elements be used in the same document?
A. Yes. Style Sheets will be ignored in browsers without CSS-support and HTML stylistic elements used.
66. Which set of definitions, HTML attributes or CSS properties, take precedence?
A. CSS properties take precedence over HTML attributes. If both are specified, HTML attributes will be displayed in
browsers without CSS support but won't have any effect in browsers with CSS support.
var testresults
function checkemail(){
var str=document.validation.emailcheck.value
var filter=/^([w-]+(?:.[w-]+)*)@((?:[w-]+.)*w[w-]{0,66}).([a-z]{2,6}(?:.[a-z]{2})?)$/i
if (filter.test(str))
testresults=true
else{
alert("Please input a valid email address!")
testresults=false
}
return (testresults)
}
</script>
<script>
function checkbae(){
if (document.layers||document.getElementById||document.all)
return checkemail()
else
return true
}
</script>
var value=document.getElementById("txtid").value;
if (value=="")
}
72. How to add a combo box dynamically at run time in Java script?
Ans. document.forms[0].<combobox name>.options[index]= new Option(Apearingtext,value)
73. What is the main difference between Client side JavaScript and Server side Java Script. How actually
they run on both side with Example?
Ans. Client side JavaScript encompasses the core language plus extras such as the predefined objects, only relevant to
running JavaScript in a browser. The client side JavaScript is embedded directly in the HTML pages and is interpreted by
the browser completely at the run time.
Server side JavaScript also encompasses the core language plus extras as the predefined objects and functions only
relevant to running JavaScript in a server. The server side java scripts are compiled before they are deployed.
This is in contrast to the SPAN as SPAN simply dos the functionality of applying the style and alignment whatever was
specified in it. DIV has ALIGN attribute in it which is not present in case of SPAN. Thus DIV is used in cases where one
wants to apply styles to a block of text. But there may be situations in which there might not be clear well structured
block of text to work with. In those cases one can opt to apply SPAN which is used to apply styles inline. That is in other
words DIV is generally used for Block of text and SPAN is generally used for words or sentences.
Markup Validity:
However, just as texts in a natural language can include spelling or grammar errors, documents using Markup languages
may (for various reasons) not be following these rules.
The process of verifying whether a document actually follows the rules for the language(s) it uses is called validation, and
the tool used for that is a validator. A document that passes this process with success is called valid.
With these concepts in mind, we can define "markup validation" as the process of checking a Web document against the
grammar (generally a DTD) it claims to be using.
NAME:
Used for specifying the name of the frame.
SCROLL:
Used for specifying the scrolling action to be activated. Can take three values namely AUTO, YES or NO.? AUTO will allow
the browser to take the decision and activate Scroll bar when needed YES specify scroll bar is needed and NO specifies
scroll bar is not needed.
ALIGN:
This is used for alignment of text and the values that can be taken by it are namely LEFT, RIGHT, TOP, MIDDLE, and
BOTTOM.
FRAMEBORDER:
Used for setting borders, around the frames if needed. A value of 1 set the border around the frame and 0 specify for no
border.
HEIGHT:
Used to specify the height of the frame and this value is mentioned in pixels.
HSPACE:
Used for specifying horizontal spacing around the frames.
Simply stated the ER model is a conceptual data model that views the real world as entities and relationships. A basic
component of the model is the Entity-Relationship Diagram which is used to visually represents data objects.
Since Chen wrote his paper the model has been extended and today it is commonly used for database design For the
database designer, the utility of the ER model is:
it maps well to the relational model. The constructs used in the ER model can easily be transformed into relational tables.
it is simple and easy to understand with a minimum of training. Therefore, the model can be used by the database
designer to communicate the design to the end user.
In addition, the model can be used as a design plan by the database developer to implement a data model in a specific
database management software.
88. How do you rate CSS types as per priority and what are the reasons like Embedded, External, Inline?
Which one gets top priority and why?
Ans. Choosing between External, Embedded and Inline CSS is critical. It is always advisable to think long term. Even
when you are working on a smaller module, you never know its future.
Moreover, one must remember that CSS is all about 'look and feel' (style) while HTML is content; so better keep them
separate. As far as possible, avoid Inline styles. If you are very sure that particular CSS classes are relevant only to the
current web page, it might be a good idea to opt for Embedded under certain circumstances. And ofcourse, there are no
cons while considering External stylesheet. One thing is very important while using External stylesheets is the
nomenclature. There are no fixed set of rules to follow but if you consider a broader view, you can easily work out a fair
plan for CSS class names. To start with, one can study some popular websites.
Inline Styles:
If a user wants to set a particular style for a particular element this can be done using Inline styles by making use of the
STYLE attribute. The STYLE attribute is different from <STYLE > tag. Thus an inline style is applied only to a particular
element.
Standard Attributes
Ans. XML is not a replacement for HTML. XML and HTML were designed with different goals:
XML was designed to transport and store data, with focus on what data is.
HTML was designed to display data, with focus on how data looks.
It is important to understand that XML is not a replacement for HTML. In most web applications, XML is used to transport
data, while HTML is used to format and display the data. My best description of XML is this: XML is a software and
hardware independent tool for carrying information.
101. How should I display HTML page without scroll bar, title bar & test?
Exp:
*/ function display_image(form) {
selectionname = form.imagename.options[form.imagename.selectedIndex].text;
selection = form.imagename.options[form.imagename.selectedIndex].value;
PreView.document.open();
PreView.document.write("<HTML><HEAD>");
PreView.document.write("<TITLE>Preview</TITLE>");
"onClick='window.close()'></FORM>");
PreView.document.write("</CENTER>");
PreView.document.write("</BODY></HTML>");
PreView.document.close(); }
</SCRIPT><body><FORM>
<option value="http://www.javascriptkit.com/day.gif">Image 2
<option value="http://www.javascriptkit.com/night.gif">Image 3
</select></FORM></body><html>
alert_box();
//-->
</SCRIPT>
function playSound(soundfile)
document.getElementById("dummy")
</script>
Ans: This can be done quite simply with the below tag.
This tag will play the music.mid once. If you wanted this song to continue without stopping, you would use
loop="infinite" instead of the loop="1", which will only play it once. If you needs this to work with Netscape and Internet
Explorer, you can use the embed tag to implement music to your page using code similar tot he below example.
Ans. Point the body background to the name of your image you wish to use as the background as shown below. This
body line should be the first line after your </head> tag.
<body background="picture.gif">
You can also have the background image fixed, so it does not move when using the scroll bar in the browser. To do this
adds the BGPROPERTIES tag as shown below.
119. How do I make it so that someone can mail me by just clicking on text?
Ans. Use the mailto command in your A HREF link tag as shown below.
The above example would create a link similar to the one shown below.
120. How do I add scrolling text to my page?
Ans. Keep in mind not all browsers support scrolling text. However to do this add a tag similar to the below example.
The above example would create the below scrolling text. If your browser supports scrolling text the below example
should be scrolling.
Ans. To do the multicolor text adjusts the color of your font tag as shown below.
<font color="blue">blue</font>
Ans. Use the A HREF link tag around the IMG image tag as shown below.
123. How do I make it so that my web page is just one solid color in the background without using an
image file?
Ans. Change the BGCOLOR (short for background color) in your body tag as shown below.
<BODY BGCOLOR="white">
Ans. The <blockquote> tag defines the start of a long quotation. </blockquote>
Ans. The param element allows you to specify the run-time settings for an object inserted into XHTML documents.
Ans. Not valid in base, head, html, Meta, param, script, style, and title elements.
Not valid in base, br, frame, frameset, hr, iframe, param, and script elements.
Ans. Yes