CSS高爾夫運動

代碼打高爾夫球是一種編程類型，其目標是使用盡可能少的字節完成任務。 CSSBATTATLE是一個代碼打高爾夫戰場，玩家完成了使用CSS和HTML重新創建目標圖像的球員。

規則相當簡單：

• 沒有外部資源（對不起，沒有）
• 您的解決方案必須在Chrome中正確渲染（僅出於評分目的）

從日常的前端作品開始，這可能是一個非常有趣的出發。除了使事情真正，非常小且仍然正確渲染之外，無需擔心可維護性，語義，性能，可訪問性或其他任何內容。

12嘗試中的高爾夫解決方案

這種類型的思想與我們大多數人為生產網站編寫前端代碼的方式非常戲劇化（我希望！），所以我一直在Github上發布所有解決方案，以既要分享一些知識又向他人學習。作為幸運的副作用，這也意味著我的意見書有相當詳細的歷史。

這是我嘗試CSSBATTATTER的第7個目標的開始到本質上的說法，看起來像這樣：

“僅居中的事物”方法

一種合理的第一種方法是簡單地將元素貼在頁面中間，在其上拍打盒子陰影和邊框半徑，然後將其稱為完成。如果我們正在寫這篇“真實”，那看起來可能是這樣：

 

  
    
      身體 {
        背景：＃0B2429;
        保證金：0;
      }

      。葉子 {
        寬度：150px;
        身高：150px;
        邊界拉迪烏斯：67％0；
        背景：＃f3ac3c;
        保證金：75px 0 75px 175px;
        盒子陰影：
          -50px 0＃998235， 
          -100px 0＃1A4341
      }
    
  
  
    <div></div>
  

以上是CSS高爾夫運動的詳細內容。更多資訊請關注PHP中文網其他相關文章！