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

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
推荐阅读
怎麼看待公關工作
怎麼看待公關工作
如何看待公關這個職業的天花闆?就像你前面說的,你也勸大家如果還有别的機會的話,比如說可以轉型品牌呀,轉型運營啊,我是同意你的說法的,就是可能我會覺得這個崗位本身,從一個行業的大盤來看的話,天然的就是數量會比較少,崗位的基數會比較少,那所以可...
2026-03-17
濟南周六高架限行嗎
濟南周六高架限行嗎
12月9日晚,濟南發布交通高峰期限行通告!即日起施行!↓↓↓限行時間:工作日交通早晚高峰期(7時至9時、17時至19時)限行對象:輕型、微型貨車以及非“魯A、魯S”的外地号牌限行路段:城市快速路經十路(邢村立交至濟南西立交)旅遊路(港西路至...
2026-03-17
中石油吉林油田2022年面試271人
中石油吉林油田2022年面試271人
中石油吉林油田2022年面試271人,其中大學本科172人,碩士研究生98人,博士研究生1人。按學校分:東北石油大學21人,遼甯石油化工大學16人,吉林大學13人,西南石油大學和中國石油大學(北京)各10人,長江大學、東北電力大學、中國石油...
2026-03-17
觀看戰狼2後心得體會
觀看戰狼2後心得體會
觀看戰狼2後心得體會?早些年,我們有一門課程一直很受歡迎《打造狼性團隊》,現在看到《戰狼2》後,是不是你也想像冷鋒(吳京飾演)一樣呢?,下面我們就來聊聊關于觀看戰狼2後心得體會?接下來我們就一起去了解一下吧!觀看戰狼2後心得體會我們的工作都...
2026-03-17
領導應該如何對員工進行有效激勵
領導應該如何對員工進行有效激勵
做管理,除了物質激勵以外,情感激勵也是很重要的。看看那些優秀的領導對員工進行情感激勵的四個方法吧。,
2026-03-17
Copyright 2023-2026 - www.tftnews.com All Rights Reserved