控制五角星问题

控制五角星问题

http://img1.sycdn.imooc.com/climg//5896e24500013b7f07670399.jpg请问我的控制器写错了吗?为什么无法控制每一个五角星?怎么写比较规范呢?

正在回答

登陆购买课程后可参与讨论,去登陆

3回答
<div class="starmap">
        <div class="star"></div>
        <div class="star star2"></div>
        <div class="star star3"></div>
        <div class="star star4"></div>
        <div class="star star5"></div>
</div>

使用

.starX{
    position:absolute;
    transform:translate(?,?) rotate(?deg) scale(.?);    
}

分别控制4个小五角星的位置

  • Holajulie 提问者 #1
    好的谢谢,我去试试。
    2017-02-07 10:30:35
没有马甲线的安琪拉 2017-02-05 19:49:01

虽然看不太出来你的问题,但是可以把之前助教老师给我讲的思路分析分享给你哈,请叫我雷锋,呵呵。

(1)先用border画一个等腰三角心,用transform:rotate将三角形旋转,将这个等腰三角形作为五角星的一个角。

(2)再用border画一个小的等腰三角形,将它定位在上一个三角形的上面。

(3)最后还是使用border画一个等腰的三角形,这个三角形的边宽与第一步的三角形边宽一样,然后也定位第一个三角形上。

后两个步骤的三角形要使用:before和:after伪元素生成。


  • 提问者 Holajulie #1
    谢谢,我已经绘制出了五个五角星,但是它们都在一列,我想单独控制每一个五角星在自己的位置上,不知道有没有什么方法。
    2017-02-06 11:02:18
WorderStart 2017-02-05 18:36:12

这个我也不是特别清楚,但是有一点命名最好用有意义的英文,最好不要用数字

  • 提问者 Holajulie #1
    好的,谢谢。
    2017-02-06 11:02:56
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
HTML5与CSS3实现动态网页 2018
  • 参与学习       1887    人
  • 提交作业       4643    份
  • 解答问题       5760    个

有HTML和CSS基础,却不知道如何进阶?本路径带你通过系统学习,完成从“会做网页”到“做出好的动态网页”的蜕变,迈出成为前端工程师的第一步。

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师