1. Hãy ủng hộ PhienBanMoi.Com bằng cách LIKE trang FANPAGE , GOOGLE+ dưới mỗi bài viết hoặc chia sẻ website nếu thấy hữu ích. Trân trọng cảm ơn!
  2. [Thông Báo] Tuyển thành viên viết bài KIẾM TIỀN trên PhienBanMoi.Com


    Nhằm mục đích phát triển Phienbanmoi.com hơn nữa, có thêm các bài viết thông tin thực sự hữu ích từ những thành viên tích cực. BQT đã quyến định tạo ra cơ hội kiếm tiền từ các bài viết được đăng tải và chia sẻ trên diễn đàn

[HELP] Sửa code Form trong HTML

Thảo luận trong 'HTMl , CSS , Javascript' bắt đầu bởi Alfred Seattle, 30 Tháng ba 2012.

  1. Alfred Seattle Member Chính Thức

    27
    21
    3

    Lượt xem: 1,473


    Các anh chị xem cái đoạn code của em nhé
    HTML:
    <form aciton="">
            <ul type="none">
                <li>
                    <label for="firstname"><span>First Name</span></label>
                    <input id="firstname" type="text" name="fristname" size="30" />
                </li>
                <li>
                    <label for="lastname"><span>Lastname</span></label>
                    <input type="text" id="lastname" name="lastname" size="30" />
                </li>
                <li>
                    <label for="email"><span>Email</span></label>
                    <input name="email" id="email" type="text" size="30"/>
                </li>
                <li>
                    <label for="password"><span>Password</span></label>
                    <input name="password" id="password" type="password" size="30" />
                </li>
                <li id="checkbox">
                    <label><span>What do you want from this forum?</span></label>
                        <input name="op1" type="checkbox"checked/>
                        <label>Know how to use Photoshop</label>
                             
                        <input name="op2" type="checkbox"/>
                        <label>Know how to use AutoCAD</label>
                                       
                        <input name="op3" type="checkbox"/>
                        <label>Know how to use Autodesk 3Ds Max</label>
                                        
                        <input name="op4" type="checkbox"/>
                        <label>Know how design a Website</label>
                                          
                        <input name="op5" type="checkbox"/>
                        <label>Other...</label>
                    
                </li>
                <li>
                    <label>What pet do you like?</label>
                    <input name="pet" type="radio" checked/>      Cat
                    <input name="pet" type="radio"/>              Dog
                    <input name="pet" type="radio"/>              Both
                </li>
                <li>
                    <label>Avantar</label>
                        <input id="fcomputer" type="radio" name="fcavantar" checked/>
                        <label for="fcomputer">Upload from your computer
                            <input type="file" name="file1"/>
                        </label>
                    
                    
                        <input id="foweb" type="radio" name="fcavantar"/>
                        <label for="foweb">Load from another web
                            <input type="file" name="file2"/>
                        </label>
                    
                </li>
                <li>
                    <label><span>Comment</span></label>
                    <textarea rows="10" cols="50">Type Here...</textarea>
                </li>
    
            </ul>
    
        </form>
    
    
    Nó sẽ được hiện thế này
    [​IMG]

    Bây giờ em muốn các option trong "What do you want from this forum?" nó xuống dòng mà không ở trong cùng một hàng thì em cho thêm đoạn CSS:
    Mã:
    #checkbox input {
    display: block;
    }
    
    Nhưng nó lại cho xuất hiện hộp checkbox ở trên, rồi label ở dưới như thế này
    [​IMG]

    Em cũng có cách là cho cả thẻ input và checkbox của từng option vào 1 thẻ div, nhưng thầy giáo em lại bảo không được dùng nhiều div. Vậy anh chị có cách nào để không cần cho vào thẻ div mà vẫn được không?
    P/s:
    Còn 1 vấn đề nữa:
    Lượn qua web izwebz.com thấy cái form như thế này:
    [​IMG]
    Sau khi thêm code CSS:
    Mã:
    span {
                display: block;
                background: red;
                border-radius: 5px 5px 0 0;
            }
    
    Kết quả:
    [​IMG]
    Vậy làm sao để khắc phục lỗi như vậy?
    Chẳng nhẽ mỗi span lại phải cố định thêm cái width???
    Em gà xin các anh chỉ bảo với!
     

    Bình Luận Bằng Facebook

  2. xdhcda

    xdhcda Moderator

    1,252
    550
    113
    Đúng rồi. không lên lạm dụng thẻ div.
    Code của em vẫn ổn mà. xuống dòng bình thường

    Cái kia của họ có phải màu đỏ đâu. với lại em chưa đặt widht cho nó
    Em cho nó vào thẻ <span> rồi đặt màu, đọ rộng, bo góc > ok ngay
     
  3. xdhcda

    xdhcda Moderator

    1,252
    550
    113
    hoangtungpc.info thích bài này.
  4. xdhcda

    xdhcda Moderator

    1,252
    550
    113
    Cái này không phải là <li> lên display:bock không có tách dụng đâu
    [​IMG]
    Code:
     

Chia sẻ trang này