- objective-c - iOS 5 : Can you override UIAppearance customisations in specific classes?
- iphone - 如何将 CGFontRef 转换为 UIFont?
- ios - 以编程方式关闭标记的信息窗口 google maps iOS
- ios - Xcode 5 - 尝试验证存档时出现 "No application records were found"
我必须创建一个六边形,我真的希望它是完整的 HTML 和 CSS。它几乎完成了,除了它不是完全对称的。左 Angular 与右 Angular 不对齐。当前的CSS:
.hexagon.outer {
width: 318px;
height: 452px;
position: relative;
}
.hexagon.outer, .hexagon.outer:before, .hexagon.outer:after {
background-repeat:no-repeat;
background-color: #585858;
}
.hexagon.outer:before, .hexagon.outer:after {
content: "";
position: absolute;
width: 262px;
height: 262px;
top:95px;
-moz-transform: rotate(54.5deg) skew(22.5deg);
-webkit-transform: rotate(54.5deg) skew(22.5deg);
transform: rotate(54.5deg) skew(22.5deg);
}
.hexagon.outer:before {
left: -130px;
}
.hexagon.outer:after {
left: 186px;
}
.hexagon.outer span {
position: absolute;
top: 0;
left: 0;
width: 100px;
height: 55px;
background:#585858;
z-index: 1;
}
.hexagon.inner {
width: 276px;
height: 372px;
position: relative;
margin:0 auto;
top: 40px;
z-index:4;
}
.hexagon.inner, .hexagon.inner:before, .hexagon.inner:after {
background-repeat:no-repeat;
background-color: white;
}
.hexagon.inner:before, .hexagon.inner:after {
content: "";
padding:0;
margin:0;
position: absolute;
width: 215px;
height: 215px;
top:79px;
-moz-transform: rotate(54.5deg) skew(22.5deg);
-webkit-transform: rotate(54.7deg) skew(22.5deg);
transform: rotate(54.7deg) skew(22.5deg);
}
.hexagon.inner:before {
left: -107px;
}
.hexagon.inner:after {
left: 169px;
}
.hexagon.inner span {
position: absolute;
top: 0;
left: 0;
width: 100px;
height: 55px;
background:#585858;
z-index: 1;
}
HTML:
<div class="hexagon outer">
<div class="hexagon inner">
</div>
</div>
外六边形最后会有(背景)效果,所以有两个(内六边形和外六边形)。
我尝试通过反复试验来对齐它们,但我认为这行不通,因为 :before 和 :after 矩形是倾斜的。
是否可以在不使用边框的情况下仅使用 CSS 创建对称六边形?
提前感谢您提供所有信息!
最佳答案
关于css - 在 CSS 中创建一个六边形,对称,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17070719/
可以用纯 CSS3 创建这样的六边形吗? 谢谢你的帮助! 最佳答案 一个简单的搜索就找到了:CSS Hexagon Tutorial 引用自网站: Put a 104px × 60px div wit
我有一个简单的六边形网格,我在其中选择一组六边形,然后用一些随机点填充这些六边形。 让我解释一下生成点的具体过程: 我使用六 Angular 坐标列表选择六边形。 将六边形分组为区域。 分别为每个区域
如何实现如下所示的六边形 ImageView 。 http://imgur.com/1PEGuQu 请注意,我尝试了这个问题的解决方案: How to give hexagon shape to Im
我正在尝试制作一款游戏,让用户获得经验值并提高等级,如下图所示。 我想通过使用进度条来实现这一点,但我无法制作一个六边形的进度条。 黄线应该随着用户积分的增加而增加。 谁能告诉我如何实现这一点?(我试
我正在尝试制作可以绘制五边形六边形等的函数。算法有问题,我应该将线条与 pygame.draw.line 进行比较吗?看起来围绕确定线坐标的工作太多了。有没有简单的方法来绘制它们?我也不知道另一个可以
我正在尝试创建一个六边形小部件。这应该看起来像这样: (请忽略横线) 在手机上是这样的: 现在六边形本身应该相当容易,网上有很多关于如何创建它们的文档。但是,关于如何添加这样的文本的信息很少。 通常,
我想用 ggplot 的漂亮框架创建一个绘图。这是一个六边形的密度图。我使用了 https://www.r-graph-gallery.com/329-hexbin-map-for-distribut
我是jointJS的新手,我需要使用JointJS创建自定义形状,我尝试使用矩形创建菱形,使其高度和宽度相同,然后旋转45度,如下所示, var diamond = new joint.shapes
这个问题在这里已经有了答案: How to make a curved edge hexagon by using CSS (6 个答案) 关闭 8 年前。 我正在尝试使用 CSS 制作一个形状:圆
我有一个由 CSS 创建的六边形。我试图在六边形内获取标题、段落和按钮,但所有这些元素都隐藏在格式化前后的六边形后面。这是代码的链接:https://jsfiddle.net/o8a3pm3h/6/
这不是关于如何使单个元素成为六边形的问题。有很多这样的。 这是一个问题,看看是否有办法创建纯 css 六边形背景。 我得到了 kind of close by creating triangles :
是否有机会在六边形内放置图像?我习惯了hexagonal shaped cells in html ,但我无法用(背景?)图像填充它。 这是我尝试过的: .top { height: 0; w
我喜欢将 CSS3 六边形置于 div 的中心(请查看下面的屏幕截图)。我使用 Foundation Framework,因此 Hexagon 由列包装器包装(在本例中使用类“warpper”)。 我
我有一个六边形,我想在它的每个 Angular 上写点东西。确切地说,我想从六边形的外部区域命名它的每个 Angular 。你可以在这个 jsfiddle 中看到代码.这是我现在拥有的: HTML:
我制作了一个具有笔划宽度的圆形六边形,但顶部和底部曲线较暗。如何给边框均匀的描边宽度?这是我的 svg 代码
我正在尝试在 Android 上实现圆角六边形 ImageView 完全像这个但是六边形: 我尽了最大的努力,但都失败了,我确实找到了this答案是完美的,因为它可以让你输入所需的边数,剩下的就由它来
我在这个网站上有问题:http://www.dark-project.cz/wesnoth/map-view/1 (点击单位)。在我的 Javascript 源代码中 http://www.dark-
我正在通过 Unity 创建一个简单的六边形几何数学游戏。这确实与 Unity 无关。 我借了Image来自 https://catlikecoding.com/unity/tutorials/ ,
我试图在六边形 div 周围放置一个边框,或者更准确地说是 3 个 div 的六边形可见区域。我已经尝试了一些不同的方法来创建一个边框来玩弄 div 的可见性。我在下面的示例中拥有的是我最接近的,但仍
是否可以创建一个属性设置为 % 而不是 px 的六边形?所以我可以在我的网站中创建一个宽度和高度为 100px 的 div 容器,设置为 100% 宽度和高度的六边形会占据整个 div?感谢您的任何回
我是一名优秀的程序员,十分优秀!