CSS低壓部件是指那些通過CSS創建并控制的頁面組件,這些組件在網頁設計與開發中擁有重要的作用。下面我們來看一些最常用的CSS低壓部件。
/* 按鈕 */ .button { display: inline-block; padding: 10px 20px; border-radius: 4px; background-color: #4CAF50; color: #FFFFFF; text-align: center; font-size: 16px; cursor: pointer; } /* 表格 */ .table { border-collapse: collapse; width: 100%; } .table th, .table td { border: 1px solid #ddd; padding: 8px; text-align: left; } /* 圖片 */ .img { display: block; max-width: 100%; height: auto; } /* 輸入框 */ .input { display: block; width: 100%; padding: 10px; font-size: 16px; border-radius: 4px; border: 1px solid #ccc; box-sizing: border-box; }
以上代碼展示了常見的按鈕、表格、圖片、輸入框等CSS低壓部件的實現方式,可以應用到日常的網頁設計與開發中。
下一篇css作業講解視頻