html中把角度压缩的属性是什么

html-css06

html中把角度压缩的属性是什么,第1张

关于html中把角度压缩的属性是：border-radius

下面举例子说明：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title>练习使用HTML</title>

        <style>

            #div1 {

                border: 2px solid #a1a1a1

                padding: 10px 40px

                background: #dddddd

                width: 300px

                /*这个属性允许你为元素添加圆角边框！*/

                border-radius: 25px

            }

        </style>

    </head>

    <body>

        <center>

            <div id="div1"></div>

        </center>

    </body>

</html>

演示：

我不能回答你的问题，只能给你一些提问表述方法上的建议。

提问要做到力求精确表达问题的特征，你的需求。

拿你的这个提问作为例子，

1、图片的45度角，是指Z轴方向上旋转呢还是平面旋转呢？别人可能会有两种歧义理解。而且45度角没有一个基准起始点，这个姑且算了，因为约定俗成地理解，角度总是以垂直或水平为起始的，你这45度正好两种都符合，算是个运气吧。但即使这样，45度也有4种不同的状态，北偏西，北偏东，南偏东，南偏西。

2、以菱形的轨迹自由移动，自由移动的概念是，移动不受任何限制。移动的概念是产生速度，速度有两个分量，速率和方向。自由移动则可以分解为，在速率和方向上都没有任何要求。这与要求沿菱形轨迹是一对矛盾。我想你可能是想表达“以随机速率沿菱形轨迹移动”？抑或是其他意思？

我的思路是这样的：

用圆角属性做出扇形，再用一个矩形去遮挡

宽高相等画出正方形

加border-radius属性做出1/4圆或者1/2圆

矩形旋转

例如transform: rotate(45deg) 顺时针旋转45度

以上都在一个position:relative的父元素中，要旋转的矩形position:absolute

用js控制矩形旋转的角度，应该就可以了