ทำยังไง border ทั้งบอร์ดเป็น link ให้เรากดได้ครับ

HTML Basic
สำหรับนักพัฒนาเว็บไซต์มือใหม่ HTML , CSS และการใช้ Tools ต่างๆ ในการพัฒนาเว็บไซต์

Moderator: mindphp

User avatar
jamepiyawat
PHP VIP Members
PHP VIP Members
Posts: 1273
Joined: 21/05/2019 10:45 am

ทำยังไง border ทั้งบอร์ดเป็น link ให้เรากดได้ครับ

Postby jamepiyawat » 21/09/2019 4:58 pm

พอดีว่าผมได้สร้าง แท็ก ul ขึ้นมาแล้วแต่ละ li ก็จะมีข้อมูลออกมาแสดงโดยจะมี border แต่ล่ะ li ทำมีระยะห่างกับตัวอักษรถ้าผู้ใช้ไม่เอาเม้าไปคลิกที่ตัวอักษรมันก็จะไม่เป็น link ทำให้ไม่สามารถไปยังหน้าอื่นได้จำเป็นจะต้องไปคลิกที่ตัวอักษรเท่านั้นถึงเป็น link ให้

อยากทราบวิธีที่จะทำให้เราสามารถคลิกแล้วเป็น link ได้ทั้ง li ครับ

Selection_999(941).png
Selection_999(941).png (29.25 KiB) Viewed 401 times


code

Code: Select all

<li class="list-group-item" >
            <a href = "<?php print $curr->category_link ?>">
               <?php print $curr->name ?>
            </a>
      </li>

User avatar
mindphp
ผู้ดูแลระบบ MindPHP
ผู้ดูแลระบบ MindPHP
Posts: 22122
Joined: 22/09/2008 6:18 pm
Contact:

Re: ทำยังไง border ทั้งบอร์ดเป็น link ให้เรากดได้ครับ

Postby mindphp » 21/09/2019 5:46 pm

ดูต้นแบบที่ต้องการมาจากไหน
ติดตาม VDO: http://www.youtube.com/c/MindphpVideoman
ติดตาม FB: https://www.facebook.com/pages/MindphpC ... 9517401606
หมวดแชร์ความรู้: viewforum.php?f=29
รับอบรม และพัฒนาระบบ: viewtopic.php?f=6&t=2042

User avatar
jamepiyawat
PHP VIP Members
PHP VIP Members
Posts: 1273
Joined: 21/05/2019 10:45 am

Re: ทำยังไง border ทั้งบอร์ดเป็น link ให้เรากดได้ครับ

Postby jamepiyawat » 24/09/2019 3:02 pm

ต้นแบบมาจาก opencart ครับ โดยเข้าใช้เป็นแท็ก a ครับ

Selection_999(967).png
Selection_999(967).png (48.06 KiB) Viewed 381 times

User avatar
tsukasaz
PHP VIP Members
PHP VIP Members
Posts: 10446
Joined: 18/04/2012 9:39 am

Re: ทำยังไง border ทั้งบอร์ดเป็น link ให้เรากดได้ครับ

Postby tsukasaz » 24/09/2019 3:06 pm

ในภาพมันเป็น class ของ bootstrap ลองดูตัวอย่างจากเว็บ https://getbootstrap.com/docs/3.3/components/#list-group-linked
The last bug isn't fixed until the last user is dead. (Sidney Markowitz, 1995)

User avatar
jamepiyawat
PHP VIP Members
PHP VIP Members
Posts: 1273
Joined: 21/05/2019 10:45 am

Re: ทำยังไง border ทั้งบอร์ดเป็น link ให้เรากดได้ครับ

Postby jamepiyawat » 24/09/2019 3:19 pm

ลองนำไปใส่แบบนี้ครับ สามารถคลิกได้แต่ว่าไม่มีเส้นและ hover แล้วไม่มีสีขึ้นมาครับ

Code: Select all

echo '<div class="list-group">';
   foreach ($categories_arr as $curr)
   {
      $class = "jshop_menu_level_" . $curr->level;
      if ($categories_id[$curr->level] == $curr->category_id)
      {
         $class = $class . "_a";
      }
      ?>
         <a class="list-group-item"href = "<?php print $curr->category_link ?>">
            <?php print $curr->name ?>
         </a>
      <?php

   }
   echo '</div>';
}


Selection_999(968).png
Selection_999(968).png (17.85 KiB) Viewed 372 times

User avatar
jamepiyawat
PHP VIP Members
PHP VIP Members
Posts: 1273
Joined: 21/05/2019 10:45 am

Re: ทำยังไง border ทั้งบอร์ดเป็น link ให้เรากดได้ครับ

Postby jamepiyawat » 24/09/2019 3:21 pm

ทำได้แล้วครับผิดที่ผมไปเขียน class ทับกันครับ



Return to “HTML CSS”

Who is online

Users browsing this forum: No registered users and 22 guests