Home思洋影视事业部网站建设知识库
0 Comments

CSS HACK和浏览器兼容问题的解决方法(2)

发布于：2013-08-15  |   作者：广州网站建设  |   已聚集：人围观
 四.移除超链接的虚线(仅对FF有效)

广州网站建设,网站建设,广州网页设计,广州网站设计

FireFox下,当你点击一个超链接时会在外围出现一个虚线轮廓.这很容易解决,只需要在标签样式中加入outline:none.



    
	
  1. 
		a{  
    2. 
	
  2. 
		outline:none;  
    3. 
	
  3. 
		}  
    4. 
	
  4. 
		 
    5. 




	五.给行内元素定义宽度



	如果你给一个行内元素定义宽度,那么它只是在IE6下有效.所有的HTML元素要么是行内元素要么就好是块元素.行内元素包括:,,和.块元素包括 DIV CSS编码时必须注意的细节



	,
	

		,

	

		,

	

		和
		
    
			
  • 
				.你不能定义行内元素的宽度,为了解决这个问题你可以将行内元素转变为块元素.
				
    
					 
    
				
    
				
      
					
    1. 
						span{width:150px;display:block}  
      2. 
					
    2. 
						 
      3. 
				
    
				
    
					六.让固定宽度的页面居中
    
				
    
					为了让页面在浏览器居中显示,需要相对定位外层div,然后把margin设置为auto.
    
				
    
				
      
					
    1. 
						#wrapper{  
      2. 
					
    2. 
						margin:auto;  
      3. 
					
    3. 
						position:relative;  
      4. 
					
    4. 
						}  
      5. 
					
    5. 
						 
      6. 
				
    
				
    
					七.图片替换技术
    
				
    
					用文字总比用图片做标题好一些.文字对屏幕阅读机和SEO都是非常友好的.
    
				
    
					HTML:
    
				
    
				
      
					
    1. 
						<h1><span>Mainheadingonespan>h1> 
      2. 
					
    2. 
						 
      3. 
				
    
				
    
					CSS:
    
				
    
				
      
					
    1. 
						h1{background:url(heading-image.gif)no-repeat;}  
      2. 
					
    2. 
						h1span{  
      3. 
					
    3. 
						position:absolute;  
      4. 
					
    4. 
						text-indent:-5000px;  
      5. 
					
    5. 
						}  
      6. 
					
    6. 
						 广州网站建设,网站建设,广州网页设计,广州网站设计
      7. 
					
    7. 
						 
      8. 
				
    
				
    
					你可以看到我们对标题使用了标准的
    
				
    
					作为标签并且用CSS来将文本替换为图片.text-indent属性将文字推到了浏览器左边5000px处,这样对于浏览者来说就看不见了.
    
				
    
					 
    
				
    
					关掉CSS,然后看看头部会是什么样子的.
    
			
    • 
		

	






			

			

					 标签：网站建设(5654)广州网站设计(5620)广州网站建设(4075)广州网页设计(1868)
					 
			

		
		
			  
	  
 
	

	 
	

	





	
	



飞机