首页
/
每日頭條
/
職場
/
css動态計算百分比
css動态計算百分比
更新时间:2026-03-04 16:24:21

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
推荐阅读
吳邪和王胖子結局
吳邪和王胖子結局
由朱一龍、毛曉彤和胡軍主演的電視劇《重啟之極海聽雷2》終于播出,這部劇在第一季完結的時候,就備受觀衆們的期待,如今相隔一個月不到,第二季就準時播出,這也足以說明制片方的效率非常高,這部劇播出之後也收獲了觀衆的一緻好評,劇情緊湊、特效用心、而...
2026-03-04
實習工資超5千這些職位
實習工資超5千這些職位
來源:中國交通新聞網11月16日下午2點,在湖南交通職業技術學院通達廣場上,2022屆畢業生供需見面會正式開始,各用人單位陸續落座,畢業生們手持簡曆,按照自己的專業和求職意願走向了自己心儀的企業單位,許多展位面前排起了長隊,在這些長隊中,不...
2026-03-04
安室透人氣下滑
安室透人氣下滑
歡迎來到新一期的拾部次元,近日Productionbaobab聲優事務所公布曾經出國留學的女聲優金元壽子歸來并恢複聲優工作,而金元壽子配過不少比較出名的動漫角色,相信大家都不會陌生。空銀子說道敗犬角色就會知道有銀不了外号的空銀子,空銀子是《...
2026-03-04
護師考過會漲工資嗎
護師考過會漲工資嗎
一、隻過了一門怎麼辦?衛生專業技術資格考試,滿分100分/科,分數線60分/科,相應專業各科目成績實行兩年為一個周期的滾動管理辦法,在連續的2個考試年度内通過同一個專業4個科目的考試,方可取得該專業資格證書。也就是說,如果這次隻考過了一門或...
2026-03-04
重點商标保護工作交流會
重點商标保護工作交流會
中國質量新聞網訊為充分發揮馳名商标保護在加快知識産權強市建設、營造良好營商環境等方面的重要作用,同時也讓馳名商标企業深入了解相關保護制度,近日,大連市知識産權局知識産權保護處、市市場監管綜合行政執法隊聯合屬地知識産權部門,對普蘭店區和瓦房店...
2026-03-04
Copyright 2023-2026 - www.tftnews.com All Rights Reserved