Fourth day of learning PHP course

November 10, 2016, Thursday.

Today, new Directives <!--Web site Hyperlinks are used to create a more complete Web navigation bar.

Web hyperlink:<a href= "Enter hyperlink url" >-input-</a>

The code is as follows:

<! DOCTYPE html>

<meta charset= "UTF8" >

<title> Warcraft Career Preview </title>

<style type= "Text/css" >

body,ul{

margin:0px;

padding:0px;

}

#baohan {

width:100%

height:60px;

background-color:red;

}

#zhiye {

height:50px;

width:1500px;

margin:0 Auto;

background-color:red;}

li{

width:70px;

height:50px;

background-color:red;

Float:left;

List-style:none;

Text-align:center;

line-height:50px;

margin-right:2px;}

Li:hover{background-color:orange;}

A{text-decoration:none;}

</style>

<body>

<div id= "Baohan" >

<ol id= "Zhiye" >

<li><a href= "Https://www.wowchina.com/zh-cn/game/classes/demon-hunter" > Warriors </a></li>

<li><a href= "Https://www.wowchina.com/zh-cn/game/classes/paladin" > Paladin </a></li>

<li><a href= "Https://www.wowchina.com/zh-cn/game/classes/hunter" > Mage </li>

<li><a href= "Https://www.wowchina.com/zh-cn/game/classes/hunter" > Hunter </a></li>

<li><a href= "Https://www.wowchina.com/zh-cn/game/classes/hunter" > Pastor </li>

<li><a href= "Https://www.wowchina.com/zh-cn/game/classes/hunter" > Shaman </li>

<li><a href= "Https://www.wowchina.com/zh-cn/game/classes/death-knight" > Death Knight </a></li>

<li><a href= "Https://www.wowchina.com/zh-cn/game/classes/druid" > Druid </a></li>

<li><a href= "Https://www.wowchina.com/zh-cn/game/classes/demon-hunter" > Demon Hunter </a></li>

<li><a href= "Https://www.wowchina.com/zh-cn/game/classes/warlock" > Warlock </a></li>

<li><a href= "Https://www.wowchina.com/zh-cn/game/classes/monk" > Martial monk </a></li>

<li><a href= "Https://www.wowchina.com/zh-cn/game/classes/rogue" > Stalkers </a></li>

</ol>

</div>

</body>

Complete the diagram, as follows:

650) this.width=650; "Src=" Http://s5.51cto.com/wyfs02/M01/8A/0C/wKiom1gkdHGhFBdfAADGdzaNIeU552.png-wh_500x0-wm_3 -wmp_4-s_92858026.png "title=" 2016-11-10_211930.png "alt=" Wkiom1gkdhghfbdfaadgdzanieu552.png-wh_50 "/>

the link function is implemented:

650) this.width=650; "Src=" Http://s3.51cto.com/wyfs02/M02/8A/0D/wKiom1gkkCHTChxoAB2JC5emPTY340.png-wh_500x0-wm_3 -wmp_4-s_738213283.png "title=" 2016-11-10_231746.png "alt=" Wkiom1gkkchtchxoab2jc5empty340.png-wh_50 "/>

Use the target= "blank" Anchor feature to enable < open new pages to retain the original page > functionality.

Note: Target default value self

Blank: Open a new page to keep the original page

<body>

<div id= "Baohan" >

<ol id= "Zhiye" >

<li><a target= "blank" href= "Https://www.wowchina.com/zh-cn/game/classes/demon-hunter" > Warriors </a> </li>

<li><a target= "blank" href= "Https://www.wowchina.com/zh-cn/game/classes/paladin" > Paladin </a></ Li>

<li><a target= "blank" href= "Https://www.wowchina.com/zh-cn/game/classes/hunter" > Mage </li>

<li><a target= "blank" href= "Https://www.wowchina.com/zh-cn/game/classes/hunter" > Hunter </a></li >

<li><a target= "blank" href= "Https://www.wowchina.com/zh-cn/game/classes/hunter" > Priest </li>

<li><a target= "blank" href= "Https://www.wowchina.com/zh-cn/game/classes/hunter" > Shaman </li>

<li><a target= "blank" href= "Https://www.wowchina.com/zh-cn/game/classes/death-knight" > Death Knight </a> </li>

<li><a target= "blank" href= "Https://www.wowchina.com/zh-cn/game/classes/druid" > Druid </a></li >

<li><a target= "blank" href= "Https://www.wowchina.com/zh-cn/game/classes/demon-hunter" > Demon Hunter </a> </li>

<li><a target= "blank" href= "Https://www.wowchina.com/zh-cn/game/classes/warlock" > Warlock </a></li >

<li><a target= "blank" href= "Https://www.wowchina.com/zh-cn/game/classes/monk" > Martial monk </a></li >

<li><a target= "blank" href= "Https://www.wowchina.com/zh-cn/game/classes/rogue" > Stalker </a></li >

</ol>

</div>

(You can see that the original page was not closed after you opened the link), as follows:

650) this.width=650; "Src=" Http://s1.51cto.com/wyfs02/M01/8A/09/wKioL1gkksbTCTj9AB2KpZwoFK0227.png-wh_500x0-wm_3 -wmp_4-s_2546369255.png "title=" 2016-11-10_232814.png "alt=" Wkiol1gkksbtctj9ab2kpzwofk0227.png-wh_50 "/>

This article from "12244251" blog, declined reprint!

Fourth day of learning PHP lessons