Home » Forums » Other Topics » Drupal User Group

ว่าด้วย order list

  • warning: realpath() [function.realpath]: SAFE MODE Restriction in effect. The script whose uid is 1005 is not allowed to access /tmp owned by uid 0 in /var/www/sites/sugree/codenone.com/subdomains/www/html/includes/file.inc on line 190.
  • warning: realpath() [function.realpath]: SAFE MODE Restriction in effect. The script whose uid is 1005 is not allowed to access /tmp owned by uid 0 in /var/www/sites/sugree/codenone.com/subdomains/www/html/includes/file.inc on line 190.
Submitted by jrp13th on 22 March, 2007 - 19:44

แบบว่าพยายามหาทางทำ order list แบบ

1. .....
     1.1 .....
     1.2 .....
2. .....
     2.1 .....
          2.1.1 .....
          2.1.2 .....
     2.2 .....
3. .....

เนี้่ยครับ มันทำได้ไหม แหะๆ

‹ Drupal มี Module กรองคำหยาบรึป่าวค่ะ Tracker กับ Permission ›
»
Submitted by dark.angular on 22 March, 2007 - 21:09.
dark.angular's picture

ผมใช้ FCK
ถ้าตัวสัญลักษณ์นี่มันจะเปลี่ยนนะครับตามจำนวน tab

ส่วนตัวเลข ไม่เปลี่ยนแบบนี้
อยากรู้ด้วยคน

»
Submitted by jrp13th on 24 July, 2007 - 06:56.
jrp13th's picture

การจะทำแบบที่ผมว่า สงสัยจะไม่มีครับ คือ
- auto number ให้
- ตั้ง tab จัดลำดับลดหลั่นตามลำดับ

แต่อาจจะประยุกต์ โดยการใช้ tag dl ผสานพลังกับ CSS มาช่วยแทนครับ..
- มี ลำดับลดหลั่น เสมอกันในแต่ละข้อย่อ
- ไม่สามารถ auto number ต้องใช้พิมพ์เองเอา..

ดูวิธีการจาก Definition Lists... reformatted! กับ Definition list display table-like ได้เลยครับ

»
Submitted by sugree on 24 July, 2007 - 08:52.
sugree's picture

อื้อหือ ถ้าอยากได้แบบนี้... ฟอร์แมตเองดีกว่า เอา markdown มาแก้พอไหว

»
Submitted by jrp13th on 25 July, 2007 - 03:11.
jrp13th's picture

ไม่ค่อยได้ใช้ markdown เลยครับ..
ที่ว่าแก้เองหมายถึง แก้ code ของ markdown เอาใ่ช่ไหมครับ..
คือพอดียังไม่ค่อยเห็นภาพนะครับ
แต่ก็เข้าใจว่าช่วงนี้คุณสุกรีคงยุ่ง
ไว้มีเวลาแล้วค่อยกลับมาถกเรื่องนี้กันต่อได้ครับ
ขอบคุณครับ

»
Submitted by iake on 24 July, 2007 - 12:24.

ใช้ ul li แบบนี้ ก็จะได้ดังตัวอย่าง

>
<style type="text/css">
 li{list-style:none}
</style>
<ul>
<li>1. .........</li>
<li>
<ul>
<li>1.1 .......</li>
<li>1.2 .......</li>
</ul>
</li>
<li>2.</li>
<li>
<ul>
<li>2.1  .........</li>
<li>
<ul>
<li>2.1.1  ......</li>
<li>2.1.2  ......</li>
</ul> 
</li>
<li>2.2  .........</li>
</ul>
</li>
<li>3. .........</li>
</ul>
</body>
</html>
</blockcode>
»
Submitted by jrp13th on 25 July, 2007 - 03:08.
jrp13th's picture

อันนี้ก็ใช้ได้ครับ แต่ถ้ามันขึ้นบรรทัดสอง ผมเดาว่ามันจะออกมาแบบนี้นะสิครับ

1.1 nononononoonon
nonoononononononono

คือมันมันจะเสมอเลขนะครับ แต่ถ้าใช้ text-indent: -1em; ช่วยแทนก็คงได้ครับ

<

p> อันนี้คือที่ผมลองทำครับ

<

p> CSS

dl { 
 display: block; 
}
dt {
 clear:   left;
 display:  block;
 font-weight: bold;
 text-align: right;
 float: left;
 width: 5em;
}
dd {
 margin:0;
 padding-left:7em;
 clear:   right;
 display:  block;
}

<

p>HTML

<dl>
  <dt>1.</dt>
  <dd>...ยาวๆ.....</dd>
</dl>
»
Submitted by sirn on 25 July, 2007 - 07:50.
sirn's picture

ถ้าเป็นผมจะใช้วิธีแบบนี้ดู

ol { list-style: none; margin: 0; padding: 0; }
ol ol { margin: 0; padding-left: 1.3em; }
li { padding-left: 1.5em; }
li span {
  float: left;
  clear: right;
  display: block;
  width: 100em;
  margin-left: -100.3em;
  text-align: right;
}
 
/* ยังจัด Formattings ของ Ordered list ได้ตามปกติ */
ol { width: 300px; }
<ol>
  <li><span>1.</span> Portable
    <ol>
      <li><span>1.1.</span> PowerBook
        <ol>
          <li><span>1.1.1.</span> PowerBook G3</li>
          <li><span>1.1.2.</span> PowerBook G4</li>
          <li><span>*</span> Usually, this should not belong inside an ordered list but I'm going to demonstrate the multi-line. That's why I'm putting this.</li>
        </ol>
        </li>
      <li><span>1.2.</span> MacBook Pro</li>
    </ol>
    </li>
  <li><span>2.</span> Desktop
    <ol>
      <li><span>2.1.</span> iMac G3</li>
      <li><span>2.2.</span> iMac G4</li>
      <li><span>2.3.</span> iMac G5</li>
      <li><span>2.4.</span> iMac Intel</li>
    </ol>
    </li>
</ol>

ดูๆ แล้วเว่อร์ไปนิดหนึ่งแฮะ แต่ผมลองบน Camino กับ Safari แล้ว หน้าตาจะออกมาดูใช้ได้ ประมาณนี้

Nested numbers in action

»
Submitted by jrp13th on 25 July, 2007 - 09:05.
jrp13th's picture

โอ้ว ขอบคุณครับ น่าสนใจมากๆ ครับวิธีนี้..

»
Submitted by sugree on 25 July, 2007 - 09:35.
sugree's picture

นี่แหละ แก้ markdown นิดหน่อยให้มันสร้าง html แบบนี้ ตรงไปตรงมาครับ

»
Submitted by mk on 25 July, 2007 - 12:49.
mk's picture

นอกประเด็น แต่โลโก้คุณ sirn เท่มาก

»

ย้าย Codenone

ประกาศย้าย Codenone ไปใช้ Forum ของ Blognone แทนครับ ตามไปตั้งกระทู้ต่อได้ที่ Codenone Forum (รายละเอียดอ่านจากกระทู้ ย้าย Codenone ไปรวมกับ Blognone)

กระทู้เก่าๆ จะย้ายตามไปในภายหลัง ตอนนี้ปิดการโพสต์กระทู้ไว้ เหลือไว้เฉพาะอ้างอิงเท่านั้น