站長資訊網

最全最豐富的資訊網站
		
				
						
			



	


	

	

				

			
常見css hack有哪些
                         

			
                          

				2022-07-29
												分類：編程知識
				閱讀(1471)				評論(0)
				
			

		

				

						




常見css hack有三種：1、條件hack，語法“<!–[if <條件關鍵字>? IE <版本號>?]>HTML代碼塊<![endif]–>”；2、屬性前綴hack，語法“selector{<hack>?屬性名:屬性值<hack>?;}”；3、選擇器前綴hack，語法“<hack> selector{ 樣式代碼 }”。




常見css hack有哪些


本教程操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。


CSS hack 是通過在 CSS 樣式中加入一些特殊的符號，讓不同的瀏覽器識別不同的符號 (什么樣的瀏覽器識別什么樣的符號是有標準的，CSS hack 就是讓你記住這個標準)，,以達到應用不同的 CSS 樣式的目的。


CSS hack 是因為現有瀏覽器對標準的解析不同，為了兼容各瀏覽器，所采用的一種補救方法.。為了兼容低版本瀏覽器器的 CSS 解析 BUG，不得不把代碼寫的很繞， 直接增加了維護成本。


CSS hack 是一種類似作弊的手段， 以欺騙瀏覽器的方式達到兼容的目的， 是用瀏覽器的兼容性差異來解決瀏覽器的兼容性問題。


常用的css hack有三種：條件hack、屬性hack、選擇符hack


1、條件hack


語法：


<!--[if <keywords>? IE <version>?]> HTML代碼塊 <![endif]-->


取值：


<keywords>


if條件共包含6種選擇方式：是否、大于、大于或等于、小于、小于或等于、非指定版本


    

  • 是否：指定是否IE或IE某個版本。關鍵字：空
    • 

  • 大于：選擇大于指定版本的IE版本。關鍵字：gt（greater than）
    • 

  • 大于或等于：選擇大于或等于指定版本的IE版本。關鍵字：gte（greater than or equal）
    • 

  • 小于：選擇小于指定版本的IE版本。關鍵字：lt（less than）
    • 

  • 小于或等于：選擇小于或等于指定版本的IE版本。關鍵字：lte（less than or equal）
    • 

  • 

    非指定版本：選擇除指定版本外的所有IE版本。關鍵字：!
    

    • 



如不想在非IE中看到某區域，可這樣寫：


<!--[if IE]> <p>你在非IE中將看不到我的身影</p> <![endif]-->


if條件6種選擇方式的使用示例


是否，示例代碼：


<!--[if IE]> <style> .test{color:red;} </style> <![endif]-->


大于，示例代碼：


<!--[if gt IE 6]> <style> .test{color:red;} </style> <![endif]-->


大于或等于，示例代碼：


<!--[if gte IE 6]> <style> .test{color:red;} </style> <![endif]-->


小于，示例代碼：


<!--[if lt IE 7]> <style> .test{color:red;} </style> <![endif]-->


小于或等于，示例代碼：


<!--[if lte IE 7]> <style> .test{color:red;} </style> <![endif]-->


非指定版本，示例代碼：


<!--[if ! IE 7]> <style> .test{color:red;} </style> <![endif]-->


2、屬性前綴hack


語法：selector{<hack>?property:value<hack>?;}


取值：