Strange php code.

I am using following code to display pages in wordpress.

<li class="<?php if ( is_home() or is_archive() or is_single() or is_paged() or is_search() or (function_exists('is_tag') and is_tag()) ) { ?>current_page_item<?php } else { ?>page_item<?php } ?>"><a href="<?php echo get_settings('home'); ?>">
          <?php _e('Home'); ?>
          </a></li>

PHP:

And the following CSS style to target <li> and <a> areas.But in <a> area of style sheet it is changing all the pages elements.Can someone explain why this is happening?

#header ul.navi{
	float:right;
	padding-top:84px;
	padding-left:1px;
	padding-right:20px;
	background:url(images/ul_hack.gif) no-repeat left bottom;
}

#header ul.navi li{
	float:left;
	list-style:none; 
	background:url(images/navi_basic.gif) no-repeat 0 0;
	width:95px;
	height:46px;
	text-align:center;
	overflow:hidden;
}

#header ul.navi li.current_page_item{
	background:url(images/navi_hili.gif) no-repeat 0 0;
}

#header ul.navi li a{
	text-decoration:none;
	color:#818181;
	width:95px;
	height:31px;
	display:block;
	float:left;
	padding-top:15px;
}

#header ul.navi li a:hover{
	font-weight:bold;
}

Code (markup):

 

this is just a user-defined functions, try to view the function library..

in your example the css style is changing based on the if statement, try to echo one of these functions (is_archive(),is_home) and look for it under the css.