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

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
推荐阅读
小區物業受傷案例
小區物業受傷案例
柳州市柳南區宏城綠都小區物業撤場後,幾名業主志願者組成“業主之家”臨時小組接手管理小區,利用停車費等公共收益聘請了保安、保潔,維護小區日常生活。今年6月,一名女保安在小區上班時騎電動車發生意外,摔成重傷,光住院醫藥費就花了近12萬元。由于受...
2026-03-09
考教師資格證面試一般都考什麼
考教師資格證面試一般都考什麼
想要獲取教師資格證書,除了筆試之外還有面試。隻有筆試順利通過了才能參加下一步的面試。近年來筆試的通過率大概隻有30%左右,而面試的通過率則相對較高,能達到65%到70%左右。那麼在好不容易通過了筆試的篩選之後,如何準備面試?教資面試時間和四...
2026-03-09
小學語文教資面試考試教案
小學語文教資面試考試教案
教學目标:#教師資格證面試#會認7個生字,會寫9個生字。通過反複朗讀,能夠背誦古詩,理解詩句感受詩句的優美。激發學生對古詩學習的興趣。教學重難點:理解詩句,激發學生對古詩學習的興趣。教學方法:朗讀法教學過程:一、提問導入二、新課教授教師範讀...
2026-03-09
為啥上班老犯困
為啥上班老犯困
犯困是很多人出現過的情況,特别是睡眠質量差,或者沒有保持良好作息習慣,睡眠不足後整個人被透支,往往會犯困,想要睡覺。如果白天疲憊,打呵欠不斷,要根據自己的作息習慣調整好,才能保持健康。而有的人睡眠時間充足還總是犯困,是不正常的表現,可能和某...
2026-03-09
ps從零開始學常用快捷鍵
ps從零開始學常用快捷鍵
經常有好友習慣問我一下ps的快捷鍵,七娃也是邊工作邊學習,工作3年也學會了很多ps的快捷鍵操作方式,說不上現在是很牛逼的“裝逼模式/高逼格設計模式”,但是也是高高手了,下面給大家按A到Z排列好的快捷鍵,後期也會慢慢補充,歡迎大佬前來補充,互...
2026-03-09
Copyright 2023-2026 - www.tftnews.com All Rights Reserved