Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 中文日韩字幕一区在线观看,午夜视频在线观看国产,色聚网久久综合 

      

        

          



          
	
          
		
          
			
			
          
				
          整合營銷服務商
          
				
          電腦端+手機端+微信端=數據同步管理
          
			
          
			
          				
				
          免費咨詢熱線：
          			
			
          
		
          
	
          
		
	
	
	

          


          
	

          

 

          
  
          
    
          
      
          
        
          「CSS」常用單位，box-sizing，字體圖標，定位原理
          
        
           
          
	
	
          
		
                        
          m 單位
          .CSS { font-size:16px; }

          • 上下文定義 font-size rem 就會按這個值定義
          • em: 根據元素的上下文來確定它的值 1em = 16px
          rem 單位
          html{ font-size:16px; }

          • 根元素定義 font-size rem 就會按這個值定義
          • rem: 根據根元素的字號來設置 1rem = 10px;
          box-sizing
          盒模型, 定義邊界是否包含 padding 和 border 的值
          box-sizing:border-box
          • 包含 padding 和 border 的值
          box-sizing:content-box
          • 轉為標準盒子，不含 padding 和 border 的值（默認）
          CSS 初始化
          一般我們寫 CSS 樣式都會先寫初始化
          <style>
  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
</style>

          • 推薦 CSS 樣式初始化寫法
          vh 和 vw 視口 單位
          瀏覽器用于顯示文檔的界面就是視口
          手機端為了顯示全 PC 界面，默認為 980px
          <meta name="viewport" content="width=device-width, initial-scale=1.0" />

          • width=device-width 寬度對于當前設備寬度
          瀏覽器設備當前界面默認被等分為 100
          • vh: 1vh = 視口高度的 1/100 ， vh(view hgight)
          • vw: 1vw = 視口寬度的 1/100 ， vw(viem width)
          <!--  例：定義寬為 50%，高為 25% -->
<style>
  .box {
    background-color: lightgreen;
    width: 50vw;
    height: 25vh;
  }
</style>

          字體圖標
          參考網址：https://www.iconfont.cn/
          方法一：Unicode 方式
          <style>
  /* 自定義字體 */
  @font-face {
    font-family: "my_iconfont";
    src: url("font_ico/iconfont.eot");
    src: url("font_ico/iconfont.eot?#iefix") format("embedded-opentype"), url("font_ico/iconfont.woff2")
        format("woff2"), url("font_ico/iconfont.woff") format("woff"), url("font_ico/iconfont.ttf")
        format("truetype"), url("font_ico/iconfont.svg#iconfont") format("svg");
  }
  /* 定義一個類來引用自定義的字體my_iconfont */
  .iconfont2 {
    font-family: "my_iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
</style>

          引入到 html 中
          <span class="iconfont2"></span>
          方法二：Font class 方式
          • 第一步：引入項目下面生成的 fontclass 代碼：
          <link rel="stylesheet" href="./iconfont.css">
          • 第二步：挑選相應圖標并獲取類名，應用于頁面：
          <span class="iconfont icon-xxx">
          定位原理與應用
          https://www.php.cn/code/36264.html
          position:statkic 默認定位
          控制偏移：
          top: 5em;
left: 4em;
right: 3em;
bottom: 2em;

          • 相對定位
            position:relative
            相對于他在的文檔流中的父級或上級進行定位
          • <style> .box { position: relative; top: 5em; left: 4em; } </style>
          SS 單位
          1. 相對長度單位
          相對長度單位指的是這個單位沒有一個固定的值, 它的值受到其它元素屬性(例如瀏覽器窗口的大小、父級元素的大小)的影響, 在響應式布局方面相對長度單位非常適用。下表中列舉了 CSS 中支持的相對長度單位:
          單位 描述 示例
          em 相對于自身 font-size(字體大小)屬性的值, 如果自身沒有設置, 則繼承父元素 font-size 屬性的值, 1em 等同于 font-size 屬性值, 例如 font-size 的值為 16px, 那么 1em 就等于 16px, 2em 就等于 32px p{line-height:2em;}
          rem 相對于根元素<html>的 font-size 屬性的大小, 比如根元素的 font-size 是 100px, 那么 1.2rem 就相當于 120px p{font-size: 1.2rem;}
          ex 相對于所用字體中小寫英文字母 x 的高度, 若無法確定 x 的高度則使用 0.5em 計算 p{font-size: 1ex;}
          ch 相對于所用字體中數字 0 的高度, 若無法確定 0 的高度則使用 0.5em 計算 p{line-height: 3ch}
          vw 相對于瀏覽器窗口的寬度, 1vw = 窗口寬度的 1% p{font-size: 5vw;}
          vh 相對于瀏覽器窗口的高度, 1vh = 窗口高度的 1% p{font-size: 5vh;}
          vmin vw 與 vh 中較小的值 p{font-size: 5vmin;}
          vmax vw 與 vh 中較大的值 p{font-size: 5vmax;}
          % 相對于父元素寬度或字體大小的百分比 div{width: 55%}
          常用的單位: em、vw、vh、%
          使用案例:
          SS 有幾個不同的單位用于表示長度。
          一些設置 CSS 長度的屬性有 width, margin, padding, font-size, border-width, 等。
          長度有一個數字和單位組成如 10px, 2em, 等。
          數字與單位之間不能出現空格。如果長度值為 0，則可以省略單位。
          對于一些 CSS 屬性，長度可以是負數。
          有兩種類型的長度單位：相對和絕對。
          瀏覽器支持
          下表中的數字表示支持該長度單位的最低瀏覽器版本。
          長度單位




          em, ex, %, px, cm, mm, in, pt, pc1.03.01.01.03.5
          ch27.09.01.07.020.0
          rem4.09.03.64.111.6
          vh, vw20.09.019.06.020.0
          vmin20.09.0*19.06.020.0
          vmax26.0不支持19.0不支持20.0
          注意: Internet Explorer 9 通過不標準的名稱 vm 來支持 vmin 。
          相對長度
          相對長度單位指定了一個長度相對于另一個長度的屬性。對于不同的設備相對長度更適用。
          單位描述在線實例
          em它是描述相對于應用在當前元素的字體尺寸，所以它也是相對長度單位。一般瀏覽器字體大小默認為16px，則2em == 32px；嘗試一下
          ex依賴于英文子母小 x 的高度嘗試一下
          ch數字 0 的寬度
          rem根元素（html）的 font-size
          vwviewpoint width，視窗寬度，1vw=視窗寬度的1%嘗試一下
          vhviewpoint height，視窗高度，1vh=視窗高度的1%嘗試一下
          vminvw和vh中較小的那個。嘗試一下
          vmaxvw和vh中較大的那個。嘗試一下
          %

          絕對長度
          絕對長度單位是一個固定的值，它反應一個真實的物理尺寸。絕對長度單位視輸出介質而定，不依賴于環境（顯示器、分辨率、操作系統等）。
          提示:
           rem與em有什么區別呢？區別在于使用rem為元素設定字體大小時，仍然是相對大小，但相對的只是HTML根元素。
          單位描述在線實例
          cm厘米嘗試一下
          mm毫米嘗試一下
          in英寸 (1in = 96px = 2.54cm)嘗試一下
          px *像素 (1px = 1/96th of 1in)嘗試一下
          ptpoint，大約1/72英寸； (1pt = 1/72in)嘗試一下
          pcpica，大約6pt，1/6英寸； (1pc = 12 pt)嘗試一下
          像素或許被認為是最好的"設備像素"，而這種像素長度和你在顯示器上看到的文字屏幕像素無關。px實際上是一個按角度度量的單位。
          如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039，我們一起飛！
                              	
          
	
	

          

          

 
          
        
        
		  
      
          
      
      
          
    
          
  
          

          



 


			
		





          
  
          
    
  
          

          

          
	
          
		
		
		
          
	
          


          
 

 







主站蜘蛛池模板：
无码人妻精品一区二区三区在线|
国产精品福利一区二区久久|
av无码一区二区三区|
国产福利一区二区精品秒拍|
国产精品538一区二区在线|
亚洲国产精品第一区二区三区|
国产一区二区三区樱花动漫|
久久综合精品国产一区二区三区|
国产在线观看一区二区三区精品
|
午夜爽爽性刺激一区二区视频|
午夜视频一区二区|
中文字幕人妻无码一区二区三区|
日韩一区二区三区无码影院|
精品欧美一区二区在线观看|
亚洲国产精品一区二区三区久久|
日本不卡免费新一区二区三区|
国产经典一区二区三区蜜芽|
夜夜精品无码一区二区三区|
无码精品人妻一区二区三区中|
怡红院美国分院一区二区
|
日本一区二区三区免费高清|
国产一区二区三区免费视频|
搡老熟女老女人一区二区|
无码一区二区三区亚洲人妻|
国产成人精品一区二区三区免费|
亚洲熟妇无码一区二区三区|
中文字幕一区二区三区免费视频|
国产一区二区久久久|
精品一区二区三区色花堂|
天堂va在线高清一区
|
无码精品不卡一区二区三区|
岛国精品一区免费视频在线观看|
91久久精品无码一区二区毛片|
香蕉久久AⅤ一区二区三区|
麻豆亚洲av熟女国产一区二|
久久se精品一区二区影院|
男人的天堂av亚洲一区2区
|
国产成人精品视频一区|
末成年女AV片一区二区|
超清无码一区二区三区|
精品人妻少妇一区二区三区不卡|