Skip to main content

Posts

Showing posts with the label Web Design

Dynamic Welcome Page in JavaScript

To create a dynamic welcome page that obtains the  user's name, then diplays it on the page. The script uses another predefined dialog box from window object(a prompt dialog) which allows the user to input a value that the script can use. The program asks the user to input a name, then displays the name in the XHTML document. <html>   <head>     <title>Using Prompt and Alert Boxes</title>     <script type = "text/javascript">       <!--       var name; //string entered by the user           name = window.prompt( "Please enter your name" );           document.writeln( "<h1> Hello, " + name + ",               welcome to JavaScript programming!</h1>" );       // -->     </script>   </head>   <body>     <p>Click Re...

Escape Sequence and Descriptions

\n --- New Line. Position the screen cursor at the beginning of the next line. \t --- Horizontal tab. Move the screen cursor to the next tab stop. \r --- Cariage button. Position the screen cursor to the beginning of the current line; do not advance to the next line. Any characters output after the carriage return overwrite the characters previously output on that line. \\ --- Backslash. Used to represent a backslash character in a string. \" --- Double quote. Used to represent a double-quote character in a string contained in double quotes. \' --- single quote. Used to represent  a single-quote character in a string.

Displaying Text in an Alert Dialog

In JavaScript we can display information in windows called dialogs (or dialog boxes) that "pop up" on the screen to grab the user's attention. Dialogs typically diplay important messages to users browing the web page. JavaScript allows you easily to display a dialog box containing a message. The following program displays Welcome to JavaScript Programming! as three lines in a predefined dialog called an alert dialog. Alert dialog box displaying multiple lines. <html>   <head>     <title>Printing Multiple Lines in Dialog Box</title>     <script type = "text/javascript">       <!--       window.alert( "Welcome to \n JavaScript\nProgramming!" );       // -->     </script>   </head>   <body>     <p>Click Refresh to run this script again.</p>   </body> </html> The script user the browser's ...

Simple Program: Displaying a Line of Text in a Web Page

JavaScript uses notations, javascript may appear strange to non-programmers. We begin by considering a simple script that dispalys the text "Welcome to JavaScript Programming!" in the body of an XHTML document. All major web browsers contains JavaScript interpreters, which process the commands written in JavaScript. The JavaScript code we write will appear in the <head> section. The browser interprets the contents of the <head> section first, so the JavaScript programs we write there execute before the <body> of the XHTML document displays. Displaying a Line of Text <html>   <head>     <title>A First Program in JavaScript</title>     <script type = "text/javascript">       <!--       document.writeln( "<h1>Welcome to JavaScript Programming!</h1>" );       // -->     </script>   </head>   <body> ...

Cascading Style Sheets (CSS) Properties for HTML elements

CSS properties are used to control the visual display of the html elements. The following are generally used properties to html documents.  Properties:     border     border-collapse     border-color     border-spacing     background     background-color     border-style     border-bottom     border-left     border-top     border-right     background-image     background-repeat     border-top-color     border-right-color     border-bottom-color     min-height     min-width     max-height     max-width     border-left-style     border-top-width     border-right-width     border-bottom-width     border-left-width     border-width     bottom     direction     display...

Working with Cascading Style Sheets (CSS) writing Styles to html document

First we have to create a html document. and write the html elements and add contents. Then Create the Cascading Style Sheets and write the style rules to the html document. The following example will help to know how to create html with css. <html> <head> <title>Fresherstarget or your title</title> <style>   p   {   color: red;   } </style> </head> <body> <p>The Sample Document for check color</p> </body> </html> The above example is very very basic and you can start with this. Thanks

Cascading Style Sheet (CSS) Syntax and style elements

For the begining, we will simply add the small style sheet. Type the following rules into the document. Syntax for CSS: <style type="text/css"> h1 {  // Give style rules } p {  // Give Style rules } </style> Here we are adding syntax to head tag in html page. <head> <title>Fresherstarget</title> <style> /* Give style rules here */ </style> </head> The Above Css Syntax will help you to begin your CSS work. First you should know the basic things about the Cascading Style Sheet (CSS), step by step learning is more important. Then only you will become a perfect Designer. For Information Please refer this website or Internet. Thanks

How CSS Style Sheets are Working ?

Without HTML it wont work. We can use Cascading Style Sheets in HTML document for interactivity, coloring, aligning contents in HTML pages and styling. It’s easy: 1. Start to write a HTML document(using tables or div tags). 2. Assign class or id to html elements 3. Write Style rules for the html elements, how you would like to display the perticular elements. 4. Attach the style sheet to the html document. When the browser displays the document, it follows your styles for rendering elements. How is it Please comment

Cascading Style Sheets (CSS) Introduction

Cascading Style Sheets is the W3C web standards for defining the presentation of the documents written s in HTML. Presentations refers to the way the document is displayed to the user whether on a computer, a mobile display, printed on paper. CSS is a separate language with its separate own syntax. The Uses of CSS Language 1) layout controls:  You can control the html layouts using CSS. That means width of the page and height of the page etc,. 2) Less work: You can change the display or appearance of an entire page or site by editing one style sheet or more. 3) Accessible sites: When all display are handled by CSS, you can markup content, making it accessible for nonvisual or mobile display. 4) browser support: Current Browser can supports CSS 2 and many parts of CSS 3.

What is HTML script tag and how to use it?

HTML Script tag is used for adding scripting language inside the script tag, that means JavaScript, JQuery, etc,. HTML Scripting languages makes HTML more Interactive and more Dynamic. HTML Script tag syntax given below, <script>   // Script programming </script> HTML Script tag example given below, <html>   <head>     <title>Welcome to Fresherstarget</title>     </head>   <body>     <script>       document.write("Hello Freshers!")     </script>   </body> </html> Script - It is Client side script, The above example will help you to learn about script. Thanks.

How to use HTML forms and form elements

HTML forms are used to send submit form values to servers or databases. HTML <form> tags are more important when we do registration and login process. HTML forms syntax given bellow, <form>     //form elements </form> HTML forms example given bellow, <html>   <head>     <title>Welcome to Fresherstarget</title>     </head>   <body>     <form>     First name: <input type="text" name="firstname"><br>     Last name: <input type="text" name="lastname">     Password: <input type="password" name="password">     <input type="radio" name="sex" value="male">Male<br>     <input type="radio" name="sex" value="female">Female     <input type="submit" value="Submit">     </form>   </body> </html> The above ...

How to use HTML Division 'div' tags in html pages

HTML Division (div) tags are widely used general tag for dividing and setting blocks with the help of css coding. Div based html codings are the effective way to design web pages. Compared with table tag div tag takes less memory. The HTML syntax for Div tags, <div>Freshersblog</div> The HTML example for Div tags, <html>   <head>     <title>Welcome to Freshersblog</title>     </head>   <body>     <div>       Welcome to Freshersblog     </div>   </body> </html> CSS Styles are more and more important for div tag, without styles we cant do good with div tag. The above example easy to learn div tag. Thanks.

HTML Image tag tutorial for freshers

HTML Image <img> tag is easy to use and <img> tag is used for displying images to web pages. Initially we have to put url's to HTML page. When we run the html page it'll load automatically. HTML Image <img> tag syntax is below, <img src="image url here" alt="Text about URL"> HTML Image <img> tag examples below, <html>   <head>     <title>Welcome to Freshers Blog</title>     </head>   <body>     <img src="freshersblog.png" alt="Freshersblog">     <img src="freshersblog.png" alt="Freshersblog" width="100" height="150">   </body> </html> The above example is used for your freshers, Thanks.

How to use HTML textbox, buttons, checkbox and radio buttons ?

HTML is easy to learn here we are going to create textbox, buttons, checkbox and radio buttons for beginers. In Freshers Blog we gave many example for html programs. Generally textbox, buttons, checkboxs and radio buttons these components will help you to create interactive registration form. Example for textboxs, checkboxs bellow, <html>   <head>     <title>Welcome to Fresher Blog</title>     </head>   <body>     <input type="text" name="text1" ></input>     <input type="checkbox" name="checkbox1">Checkbox 1</input>     <input type="radio" value="Radio">Radio 1</input>     <input type="submit" value="Freshersblog"></input>   </body> </html> The above example beginners can learn html more quickly and easily. Thanks.

Hypherlinks in HTML, How to use Hypherlinks ?

Hypherlinks HTML Hypherlinks will help you to go next page that means when you click a hypherlink it'll send you to next page. In Hypherlinks we are using Ancher tag (a). The Hypherlink syntax is, <a href="link">Fresher Blog</a> The Following example is for hypherlink, <html>   <head>     <title>Welcome to Freshersblog.com</title>     </head>   <body>     <a href="www.freshersblog.com">Freshers Blog</a>   </body> </html> When you click hypher link Freshers Blog It'll send you to www.freshersblog.com page. I hope this example will helpfull for you Thanks,

HTML Unorder list example for beginers

HTML Unorder list is very very important concept in html, with ul, li tags we can produce list of contents with css styles. In html unorder list is used for menus, navigation and some others designs. HTML Unorder list example : <html>   <head>     <title>Welcome to Fresherstarget</title>     </head>   <body>     <ul>       <li>First List</li>       <li>Second List</li>       <li>Third List</li>       <li>Fourth List</li>     </ul>   </body> </html> The above html unorder list example program is best one for beginers I hope it'll helpfull for you Thanks, If any doubts comment here..

HTML header tags ( H1 H2 H3 H4 H5 H6 ) for Beginers

HTML header tags are more important for displaying text with bold and big. Header tags also more useful for Search Engine Optimization, basically search engines searches header tags and meta tags and its contents. Here is the example for header tags, <html>   <head>     <title>Welcome to Fresherstarget</title>     </head>   <body>     <p>This is the sample program for HTML from Fresherstarget</p>     <h1>Freshers Blog</h1>     <h2>Freshers Blog</h2>     <h3>Freshers Blog</h3>     <h4>Freshers Blog</h4>     <h5>Freshers Blog</h5>     <h6>Freshers Blog</h6>   </body> </html> The Above program is the best example for header tags. Thanks, Freshers Blog. If any doubts post your comment here...

HTML Sample Program for Table tag and th, tr, td tags for freshers

HTML table is effective way to design website but not now. Because table based coding takes more memory comapred with div based coding. Any way table is more important for Designers. It is More useful for sometimes. HTML Example for Table tag: <html> <head> <title>  Welcome to Fresherstarget Learning </title> </head> <body>   <table>     <tr>       <th>Reg No</th>       <th>Name</th>     </tr>     <tr>       <td>123</td>       <td>Raj Kumar</td>     </tr>   </table> </body> </html> The above program is the best example for the table tag. I hope that will helpfull for you. Thanks, Freshers Blog

HTML Programming Introduction and Basic Program for Freshers

HTML is a Web Page Designing Language with it we can design interactive user interface. HTML is the front end development primary Programming language. HTML stands for Hypher Text Markup Language. The Basic Syntax of HTML Markup Language is follow, <html>   <head>     <title>Welcome to Fresherstarget</title>     </head>   <body>     <p>This is the sample program for HTML from Fresherstarget</p>   </body> </html> <html>  -  It is a starter for all html programs <head>  -  It includes title tag and we can add styles here <body>  -  All Designing tags and designing operations done here <p>   - Paragraph tag is used to write contents

Learn HTML fundamentals for beginners

HTML Stands for Hypertext Markup Language is used to create webpages and websites, It is the most widely used language to write Web Pages. As its name suggests, HTML is a markup language. HTML is easy to learn and implement your ideas. HTML is full of tags and without CSS HTML is nothing. HTML is nothing more than well structured content. Try to learn HTML with Cascading Style Sheet(CSS). You can build html coding with any type of text editors. Basic understaning is requred on internet browsing using a browser like Internet Explorer, Firefox,  Chrome etc. Originally, HTML was developed or invented with the intent of defining the structure of documents or pages like headings, paragraphs, tables,  lists, and so forth to facilitate the sharing of scientific information between researchers. The requirement to learn html is only two things you need to have: 1) Simple Text Editor, 2) Web Browser Header Elements <head> --- </head> - Opening and Ending tag for...