<!DOCTYPE html>
<
html
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
meta
name
=
"viewport"
content="
initial-scale
=
1
.0,
maximum-scale
=
1
.0,
user-scalable
=
no
">
<
link
rel
=
"stylesheet"
type
=
"text/css"
href
=
"themes/metro/easyui.css"
>
<
link
rel
=
"stylesheet"
type
=
"text/css"
href
=
"themes/mobile.css"
>
<
link
rel
=
"stylesheet"
type
=
"text/css"
href
=
"themes/icon.css"
>
<
script
type
=
"text/javascript"
src
=
"jquery.min.js"
>
</
script
>
<
script
type
=
"text/javascript"
src
=
"jquery.easyui.min.js"
>
</
script
>
<
script
type
=
"text/javascript"
src
=
"jquery.easyui.mobile.js"
>
</
script
>
<
style
>
p{
line-height:150%;
}
</
style
>
</
head
>
<
body
>
<
div
class
=
"easyui-navpanel"
>
<
header
>
<
div
class
=
"m-toolbar"
>
<
div
class
=
"m-title"
>
EasyUI Button Groups
</
div
>
</
div
>
</
header
>
<
div
style
=
"text-align:center;padding:10px"
>
<
span
class
=
"m-buttongroup"
>
<
a
href
=
"javascript:void(0)"
class
=
"easyui-linkbutton"
data-options
=
"toggle:true,group:'g1',selected:true"
onclick
=
"display('#htmlDiv')"
style
=
"width:80px;height:30px"
>HTML</
a
>
<
a
href
=
"javascript:void(0)"
class
=
"easyui-linkbutton"
data-options
=
"toggle:true,group:'g1'"
onclick
=
"display('#cssDiv')"
style
=
"width:80px;height:30px"
>CSS</
a
>
<
a
href
=
"javascript:void(0)"
class
=
"easyui-linkbutton"
data-options
=
"toggle:true,group:'g1'"
onclick
=
"display('#phpDiv')"
style
=
"width:80px;height:30px"
>PHP</
a
>
</
span
>
</
div
>
<
div
id
=
"items"
style
=
"padding:10px 20px;"
>
<
div
id
=
"htmlDiv"
class
=
"m-item"
>
<
p
>HTML stands for HyperText Markup Language.
It is used to design web pages using a markup
language. HTML is the combination of Hypertext
and Markup language. Hypertext defines the link
between the web pages. A markup language is used
to define the text document within tag which defines
the structure of web pages..
</
p
>
</
div
>
<
div
id
=
"cssDiv"
class
=
"m-item"
style
=
"display:none"
>
<
p
>Cascading Style Sheets, fondly referred to as CSS,
is a simply designed language intended to simplify
the process of making web pages presentable.
CSS allows you to apply styles to web pages.
More importantly, CSS enables you to do this
independent of the HTML that makes up each web page.
</
p
>
</
div
>
<
div
id
=
"phpDiv"
class
=
"m-item"
style
=
"display:none"
>
<
p
>The term PHP is an acronym for PHP: Hypertext
Preprocessor. PHP is a server-side scripting language
designed specifically for web development. PHP can be
easily embedded in HTML files and HTML codes can also
be written in a PHP file.
</
p
>
</
div
>
</
div
>
</
div
>
<
script
>
function display(id){
$('div.m-item').hide();
$(id).show();
}
</
script
>
</
body
>
</
html
>