एचटीएमएल

Question

में हेक्सागोनल आकार की कोशिकाओं क्या एक हेक्सागोनल ग्रिड है जो एक HTML ब्लॉक को डिजाइन करने का कोई तरीका था? एक मधुमक्खी शहद के समान। यह एक सीएसएस स्टाइल कार्य की तरह दिखता है।

Answer 1

आप एक बड़ी सीमा का उपयोग कर सकते हैं जो मोटा हो जाएगा और आप तत्व पर त्रिकोणीय आकार बना सकते हैं, fyi।

उदाहरण: http://jsfiddle.net/pAGJG/

तो तुम एक शीर्ष त्रिकोण, मध्य अनुभाग, और नीचे त्रिकोण के साथ एक <div class="hexagon"> कर सकते हैं, और कई hexagons हैं।

संपादित करें:

अपडेट किए गए उदाहरण: http://jsfiddle.net/rRDby/

यह एक आदर्श षट्भुज नहीं है बल्कि यह आप कैसे आप इसका इस्तेमाल कर सकते हैं की एक विचार देता है। आप सभी को मजा कर सकते हैं।

संपादित करें # 2: स्टू जाहिरा तौर पर पहले से ही कुछ किया है @http://www.cssplay.co.uk/menus/hexagon.html

Answer 2

Tantek Çelik's work from 2001 चेक आउट: वह HTML और सीएसएस से एक षट्भुज (अन्य आकृतियों के साथ) उत्पन्न करता है। एरिक मेयर ने "स्लंट्स" here के विषय को भी संबोधित किया। Lasse Reichstein Nielsen has a straightforward how-to साथ ही walkthrough of generating other shapes जो उपयोग में हो सकता है।

Answer 3

बस इस जवाब को वहां फेंकने जा रहा है - मुझे संदेह है कि यह सही है, लेकिन ओपी का वाक्यांश अस्पष्ट है, और सचमुच मुझे अन्य दो उत्तरों पसंद नहीं हैं - वे हैक की तरह असहज महसूस करते हैं।

यदि पृष्ठभूमि के लिए आपको "हेक्सागोनल ग्रिड" की आवश्यकता है, तो आप नियमित हेक्सागोन ग्रिड प्राप्त करने के लिए कुछ सरल सीएसएस पृष्ठभूमि टाइलिंग का उपयोग कर सकते हैं।

इस तरह एक tileable छवि ले रहा है:

फिर आप टाइल कुछ सरल सीएसएस:

background: url('hex-tile.png'); 

और यह बड़े करीने से एक "हेक्सागोनल ग्रिड" के रूप में दोहराने चाहिए। उदाहरण: http://jsfiddle.net/MqyHv/1/