01/10/2018, 10:17

Cài đặt vị trí button trong HTML

Chào các anh trong diễn đàn, em mới tự học HTML và em đang tạo 1 button để chuyển hướng sang một trang html khác, em muốn di chuyển vị trí của button này thì làm thế nào ạ? Cảm ơn mọi người ạ

<html>
<body>
<form method="get" action="trang 2.html">
<input type="submit" value="Nhan vao day">


</form>
</body>
</html>

Henry viết 12:24 ngày 01/10/2018

Cho thẻ a vào trong <button> xem sao.

Quang.Andrei viết 12:28 ngày 01/10/2018

Dạ em mới học hôm qua nên còn chưa hiểu lắm ạ, anh có thể nói rõ cho em được không ạ.

Henry viết 12:18 ngày 01/10/2018

Nếu muốn bấm vào đó ta nhảy sang trang khác thì ta thường hay dùng thẻ <a>

<a href="somelink">Link</a>

Vậy giờ thử đặt cái button

<button><a href="somelink">Link</a></button>

Xem nó hoạt động không?

Quang.Andrei viết 12:22 ngày 01/10/2018

dạ có hoạt động ạ, bây giờ muốn di chuyển vị trí button kia dùng CSS để thực hiện ạ, em mới học mong được anh chỉ giáo thêm ạ, em cảm ơn anh ạ

Henry viết 12:27 ngày 01/10/2018

bây giờ muốn di chuyển vị trí button kia dùng CSS để thực hiện ạ

Miêu tả rõ ràng mới hình dung nổi

Quang.Andrei viết 12:28 ngày 01/10/2018

Em muốn di chuyển button ra center thay vì left-top ạ

Đào An viết 12:26 ngày 01/10/2018

Có thể dùng flex-box để căn chỉnh vị trí các item đơn giản, hoặc có thể dùng CSS position tuy nhiên mất công hơn

CodePen

WOJBXX

...

Henry viết 12:31 ngày 01/10/2018

Đơn giản thôi. Chúng ta sẽ gói nó lại

<div class="container">
    <button><a href="somelink">Link</a></button>
</div>

Ở Css chúng ta sẽ

.container {
    height: 50px;
    width: 100px;
    margin: cách_bên_trên auto;
}

Là sẽ ra giữa. Mình không biết nhiều HTML CSS, chỉ lướt lướt qua Facebook học lỏm thôi.

Dark.Hades viết 12:19 ngày 01/10/2018

<button><a href=“somelink”>Link</a></button>

Button sao lại đi đôi với tag a, tối kỵ, cũng không hẳn, mà chưa thấy có ai làm như thế bao giờ

Henry viết 12:22 ngày 01/10/2018

<form action="somelink">
    <input type="submit" value="Link" />
</form>

Theo mình biết người ta hay làm kiểu này.
Nhưng hình như giống y chang code của người hỏi. Nghĩ là hỏi cách khác.

Vô Thin viết 12:22 ngày 01/10/2018

Nếu canh chỉnh CSS khó quá, chủ topic chỉ muốn nhìn cho được đúng vị trí thì chơi theo kiểu “chày cối”:

<body>
<form method="get" action="trang 2.html">
    <p>&nbsp;<br>&nbsp;<br>&nbsp;</p>
    <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="submit" value="Nhan vao day"></p>
</form>
</body>

Cứ nờ bê éc pi dấu chấm phẩy đến N lần khi nào thấy ưng ý thì dừng Kiểu này giống đánh Word dùng phím space bar để canh chỉnh dòng chữ.

Thuc Nguyen Tan viết 12:33 ngày 01/10/2018

<body>

  <div style="width:500px; margin:auto;padding:10px; border:1px solid gray;">
    <form method="get" action="http://vnexpress.vn">
      <div style="text-align:right;"><input type="submit" value="Nhan vao day"></div>
    </form>
  </div>
  <hr />
  <div style="width:500px; margin:auto;padding:10px; border:1px solid gray;">
    <form method="get" action="http://vnexpress.vn">
      <div style="text-align:left;"><input type="submit" value="Nhan vao day"></div>
    </form>
  </div>
  <hr />
  <div style="width:500px; margin:auto;padding:10px; border:1px solid gray;">
    <form method="get" action="http://vnexpress.vn">
      <div style="text-align:center;"><input type="submit" value="Nhan vao day"></div>
    </form>
  </div>


</body>

Bình luận về bài viết này

Chia sẻ tin đăng đến bạn bè

Gửi Messenger

Bài liên quan

Quang.Andrei

0 chủ đề

0 bài viết

Tác giả nổi bật