首页
/
每日頭條
/
職場
/
css動态計算百分比
css動态計算百分比
更新时间:2026-03-06 01:57:34

css動态計算百分比(用CSS畫一個等邊三角形)1

css是前端面試必考的内容,有時候會面試官會出題讓你畫一些基本圖形。因為畫圖的過程中能考察很多的CSS知識點。今天我們就和大家介紹一個比較難得等邊三角形。

思路是利用三個div的邊框來拼成一個三角形,隻需要調整好左右兩個div邊框的旋轉角度,就能生成一個等邊三角形。可以使用三個div來實現,也可以借助僞類來實現三個div的效果。代碼如下:

// css.box{ border-bottom:1px solid #030303; width:100px; height:100px; margin: 0 auto; box-sizing: border-box; position: relative; } .box:before,.box:after{ content:""; display: block; width:100px; height:100px; box-sizing: border-box; position: absolute; } .box:before{ border-left:1px solid #030303; transform-origin: left bottom; transform: rotate(30deg); } .box:after{ border-bottom:1px solid #030303; transform: rotate(60deg); transform-origin: right bottom; }//html<div class="box"></div>

css動态計算百分比(用CSS畫一個等邊三角形)2

等邊三角形

,
Comments
Welcome to tft每日頭條 comments! Please keep conversations courteous and on-topic. To fosterproductive and respectful conversations, you may see comments from our Community Managers.
Sign up to post
Sort by
Show More Comments
推荐阅读
北京有多少處級領導
北京有多少處級領導
北京市平谷區人大常委會日前任命底志欣、唐朝輝為平谷區政府副區長。唐朝輝是名“80後”。新京報記者不完全統計,目前北京市“80後”區政府領導已達10人(挂職不計算在内),其中兩人在京外挂職。平谷新任80後副區長來自昌平6月5日,北京市平谷區第...
2026-03-06
專科進央企的學校
專科進央企的學校
石家莊郵電職業技術學院始建于1956年,是中國唯一培養郵政專門人才的高校,是中國郵政集團有限公司所屬高等院校、中國共産黨中國郵政集團有限公司黨校、中國郵政集團有限公司培訓中心、中國郵政網絡學院全國中心、國家開放大學郵政學院、中國郵政科技服務...
2026-03-06
面試前如何了解公司
面試前如何了解公司
一般公司通知面試有兩種方式:一是電話,二是書面通知或者郵件通知。面試通知的到來也意味着你的“偵察行動”的開始。如果是電話通知,除了記下對方公司的名稱、面試的時間地點以外,不要簡單地就說再見,請盡力搞清如下問題:面試方式:是多人同時進行面試?...
2026-03-06
hr面試應該知道的10個方法
hr面試應該知道的10個方法
hr面試應該知道的10個方法?相信大家一提到招聘工作,肯定會有講不完的話題,也有說不完的故事隻要我們一提到和招聘有關系的人力資源工作,必然會有很多内容發生,故事一旦發生,必定相當精彩,近幾年的招聘“神奇”案例屢見不鮮,就是這個原因,我來為大...
2026-03-06
職業技術學院和專科什麼區别
職業技術學院和專科什麼區别
同樣是專科,職業學院與專科學院有什麼不同?随着高等教育的不斷發展,目前高校已經達3000多所,在這其中有不同種類的高校,有985、211高校,有雙一流高校,還有一些本科高校,此外還有一部分專科院校。經過這麼多年的發展,其實現在分布的就隻有本...
2026-03-06
Copyright 2023-2026 - www.tftnews.com All Rights Reserved