Ashish Awasthi's Blog

Thursday 28 June 2018

HTML Tutorial - A Quick Overview for beginners

After this HTML Tutorial, you'll learn about basics of HTML and it's tag. It'll help you in developing and customizing applications and Web sites that make use of HTML. With our online HTML editor, you can run HTML code directly from your browser.

What is HTML-

HTML stands for Hyper Text Markup Language
An HTML file is a text file containing small markup tags
The markup tags tell the Web browser how to display the page
An HTML file must have an .htm or .html file extension
An HTML file can be created using a simple text editor as Notepad

HTML Tags-

The HTML tags are used to markup HTML elements
The HTML tags are surrounded by the two characters
The surrounding characters are called angle brackets
HTML tags normally come in pairs
The first tag in a pair is the start tag, the second tag is the end tag
The text between the start and end tags is the element content
HTML tags are not case sensitive

Simply open Online HTML Editor in the new tab Tab and copy HTML code from this page and just paste in the editor, then click on "Run Button" at top of the editor and see your result in the right panel.

Headings in HTML

<html>
<body>
<h1>HTML Largest Heading</h1>
<h2>HTML Second Largest Heading</h2>
<h3>HTML Third Largest Heading</h3>
<h4>HTML Fourth Largest Heading</h4>
<h5>HTML Fifth Largest Heading</h5>
<h6>HTML Smallest Heading</h6>
</body>
</html>

Paragraphs in HTML

<html>
<body>
<p>This is example of paragraph, first paragraph</p>
<p>HTML tutorial, Second paragraph</p>
</body>
</html>

Links in HTML

<html>
<body>
<a href="http://www.awasthiashish.com">Ashish Awasthi's Blog</a>
<br />
<a href="http://www.facebook.com">Link to facebook</p>
</body>
</html>

Ordered List in HTML

<html>
<body>
<ol>
<li>Computers</li>
<li>Software</li>
<li>Laptop</li>
<li>Mobile</li>
</ol>
</body>
</html>

Unordered List in HTML

<html>
<body>
<ul>
<li>Computers</li>
<li>Software</li>
<li>Laptop</li>
<li>Mobile</li>
</ul>
</body>
</html>

Moving text using MARQUEE tag in HTML

<html>
<body>
<marquee>HTML Tutorial - This is moving text</marquee>
</body>
</html>

Images in HTML

<html>
<body>

<img src="http://www.awasthiashish.com/wp-content/uploads/2018/06/logo.png"
alt="Ashish Awasthi's Blog" width="200" height="200">

</body>
</html>

Text in HTML

<html>
<head>
<title>Title</title>
</head>
<body>

<b>Bold Text</b>
<br>
<i>Italic Text</i>
<br>
<u>Underline Text</i>

</body>
</html>

Test your HTML skills with W3School's Quiz

Cheers :) Happy Learning

Tuesday 8 May 2018

Change Style of ADF TreeTable, Column, Data Cell, Selected Row using ADF Skin

Hello Everyone

In this tutorial, We'll learn to change look n feel of ADF tree table component using Oracle ADF Skin
Here I am using Departments and Employees table HR Schema to prepare the model and created tree Table using view link between Departments and Employees View Object

Monday 16 April 2018

Increase Icon size of af:panelSpringBoard using ADF Skin

ADF Faces af:panelSpringBoard component shows af:showDetailItem in a fancy view using icons as the notation of showDetailItem

From Oracle Docs

The panelSpringboard control can be used to display a group of contents that belongs to a showDetailItem. An icon strip with icons representing the showDetailItem children along with the item's contents are displayed when in strip mode, and a grid of icons with no contents shown is displayed in grid mode. When the user selects an icon while the panelSpringboard is in strip mode, the panelSpringboard discloses the associated showDetailItem. When the user selects an icon while the panelSpringboard is in grid mode, this automatically causes the panelSpringboard to display in strip mode. Typically you would put one or more showDetailItem components inside of the panelSpringboard but you may also alternatively place a facetRef, group, iterator, or switcher inside of the panelSpringboard as long as these wrappers provide showDetailItem components as a result of their execution

I have added a panel springboard on the page and by default, it looks like this

Search this blog