一、使用方式
在CSS中，可以使用border-radius属性来设置标题前的正方形，该属性的值可以控制正方形的大小。以下是一个简单的示例：
“`html
<div class=”box”>
<h2>偶的美丽标题</h2>
</div>
在这个示例中，使用了一个名为“box”的CSS类，并使用了border-radius属性来设置正方形的大小为50px。h2标签也被设置了相同的属性，以使正方形的大小与标题大小匹配。
二、相关属性
除了border-radius属性外，还有其他一些属性可以用于设置标题前的正方形。以下是一些常用的属性：
1. background-color：该属性用于设置正方形的背景颜色。
2. border：该属性用于设置正方形边框的颜色和宽度。
3. content：该属性用于设置正方形内的内容。
4. box-shadow：该属性用于设置正方形的内阴影和外阴影，可以用于添加渐变效果。
三、如何优化性能
由于CSS标题前的正方形需要使用border-radius属性和CSS的伪元素，因此它可能会影响网页的性能。为了优化性能，可以使用以下方法：
1. 避免使用大量的伪元素：尽可能使用直接设置元素属性的方法，而不是使用大量的伪元素。
2. 使用浏览器缓存：尽可能在第一次加载时设置正方形的属性，避免重复设置。
3. 使用背景图片：如果正方形的内容需要填充背景色，可以使用背景图片，以节省带宽和内存。
CSS标题前的正方形是一种常见的网页布局元素，用于将标题与网页内容分开，使得标题更加清晰明了。除了border-radius属性外，还有其他一些属性可以用于设置标题前的正方形。为了优化性能，可以使用避免使用大量的伪元素、使用浏览器缓存和使用背景图片等方法。