2

我为自己设定了一个挑战，即在不使用单个图像的情况下开发网站。我将主要使用图标字体，但对于这个粒子图形，我认为我可以使用 div 或其他元素，而不是通过 css 设置样式，例如给边框或其他东西......但我发现它不像我那么容易思想，我无法实现。

这是我需要得到的最终结果：

在此处输入图像描述

我对对角线感兴趣，忽略背景。有没有办法在 html 或 css 的帮助下复制这些行？

4

3 回答 3

5

您可以使用 css 执行您所要求的操作background-image: repeating-linear-gradient()

Lea Verou 有一个很棒的画廊：http ://lea.verou.me/css3patterns/

您可以修改对角条纹图案并获得您想要的。

于 2012-12-22T12:06:37.060 回答
0

试试这个， http://www.patternify.com/ 你可以在这里制作这样的图案，并将其转换为 CSS 以用于您的背景。

于 2012-12-22T11:52:16.893 回答
0

Hope this helps you get started..!! 小提琴演示在这里..

HTML

<body>      
        <div class="myDiv"></div>        
        <div class="myDiv"></div>
        <div class="myDiv"></div>        
        <div class="myDiv"></div>        
        <div class="myDiv"></div>
        <div class="myDiv"></div>        
        <div class="myDiv"></div>
        <div class="myDiv"></div>                
</body>​

CSS

.myDiv {
background-color: none;
border: solid 2px #AAA;
margin: 30px;
height: 5px;
-webkit-transform: rotateZ(115deg); // Chrome
-moz-transform: rotateZ(115deg) // Mozilla Firefox
}
于 2012-12-22T12:41:29.620 回答