常見的小圖標制作幾種方法
2022-06-28 分類： 網站建設
在我們制作網頁時，例如導航等，會遇到很多的一些小圖標，這里以京東的小三角
（如下圖） 舉例，來介紹常用的一些方法。
方法一：也是比較簡單的一種方法。用background 來做，
一般用一個行內標簽如 i ，s 等 先轉換 顯示方式 display：block；，然后設置寬高。
如果不是單一的圖片，而是精靈圖，則應該設置background-position 屬性
方法二：我認為是一種比較有技巧性的方法，老版jd就這么玩的。
具體來說就是 用兩個標簽 父標簽控制圖標的位置 ，子標簽里是一個菱形依靠定位來展示大小
和方向，父標簽第二作用是依靠overflow：hidden；截掉子標簽超出的部分。是不是很巧妙。
代碼如下：
1 22 23 24 25◇26 27
分享題目：常見的小圖標制作幾種方法
文章URL：http://m.kartarina.com/news/172654.html
成都網站建設公司_創新互聯，為您提供定制開發、電子商務、軟件開發、網站導航、品牌網站制作、自適應網站
聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯
猜你還喜歡下面的內容
- 中小型企業網站選擇網絡營銷產品需要考慮哪些因素？ 2022-06-28
- 網站優化人員怎么做才能確保seo搜索引擎快速索引網頁？ 2022-06-28
- 8個方面讓你成為優秀的產品設計師 2022-06-28
- 網站開發語言PHP的優勢 2022-06-28
- 應用程序的訪問控制機制 2022-06-28
- 平面設計重要性 2022-06-28
- 如何網站優化的錨文本鏈接？ 2022-06-28
- 設計精美網站首頁常用的兩種類型 2022-06-28
- SEO啟示錄：排名突然下降的7個原因 2022-06-28
- 怎么發揮tag標簽的最大作用 2022-06-28
- 長沙SEO推廣團隊怎么管理更高效？可采取哪些措施？ 2022-06-28
- 企業要如何利用論壇做推廣？做好這幾步讓網站流量翻倍！ 2022-06-28
- 智能建站到底怎樣？10強創新互聯建站為您分析 2022-06-28
- 淺談產品運營中的數據分析 2022-06-28
- 創新互聯從三方面講述如何讓你的軟文產生閱讀亮點 2022-06-28
- 社區如何進行運營實戰解析 2022-06-28
- 成都企業網站搭建步驟流程有哪些? 2022-06-28
- 怎么優化關鍵詞? 2022-06-28
- 解析PHP中ob_start()函數的用法 2022-06-28