01/10/2018, 08:15

[HTML - CSS] Tại sao định dạng 1 lần thẻ <a href=""> nó lại định dạng cho tất cả

Chã là em đang tự học ngôn ngữ này, nhưng không biết lỗi chỗ nào. sao em định dạng có 1 lần mà nó lại tự động định dạng cho những thẻ còn lại dù em đã sử dụng <div> để bao bọc nó lại

đây là code của em:

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <link rel="stylesheet" type="text/css" href="../index/css/style.css" />
        <title>Untitled Document</title>
    </head>
    <body>
        <div id="index">
            <header>
                <div id="banner">/div>
            </header>
            <nav>
                <div id="menu">
                    <ul>
                        <li>a href="#">Giới thiệu</a>
                        <li>a href="#">Văn bản</a>
                        <li>a href="#">Thư viện</a>
                        <li>a href="#">Liên hệ</a>
                        <li>a href="#">Góp ý</a>			
                        <li><a href="#">Hỏi & Đáp</a>
                    </ul>
                </div>
            </nav>
            <article>
                <div class="article">
                    <h1>center>BÀI VIẾT MỚI NHẤT/h1>/center>
                    <hr>
                    <a href="1">asdasdasd/a>
                    <img src="../index/hinh/5.png">
                    <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p> -->
                </div>
            </article>
            <aside>
                <div id="aside"></div>
            </aside>
            <footer></footer>
        < /div>
    </body>
< /html>

Mấy dấu “<” em đã xóa để code hiển thị…!!

Css:

@charset "utf-8";
/* CSS Document */
#body{
    padding: 0px;
    margin: 0px;
}
#banner{
    background-image: url(../hinh/1.jpg);
    background-size: 100% 100%;
    padding-bottom:20%;
}
#menu>ul{
    list-style-type: none;
}
#menu>ul, li, a{
    line-height: 40px;
    background-color: #6666FF;
    color: #fff;
    text-align: center;
    text-decoration: none;
}
#menu>li, a{
    float:left;
    width:210px;
    height: 40px;
    margin-top: -15px;
}
#menu>li, a:hover{
    background: #FFCC66;
    color: #333;
}
.article{
    min-height:auto;
    margin-top: 40px;
    margin-left: 40px;
    width: 75%;
    background: #EEEEEE;
    float: left;
    border-radius: 20px;
}
.article>hr{
    width: 850px;
    height: auto;
}
.article>h1{
    color: #525EFB;
}
#aside{
    float: left;
    min-height:500px;
    margin-top: 40px;
    margin-right: 35px;
    width: 18%;
    background: yellow;
    float: right;
}

Đây ạ sao cái nội dung dưới nó lại tự định dạng luôn…

Sáng Béo viết 10:27 ngày 01/10/2018

Mấy dấu “<” em đã xóa để code hiển thị…!!

dùng markdown để post code đi bạn.

Làm sao để có thể hiển thị syntax highlighting bằng markdown? Các bạn phải đánh dấu ``` như ví dụ dưới đây Chú ý, dấu ``` được tạo ra bởi nút nằm bên trái số 1 trên bàn phím, nút này sẽ là ~ khi bấm giữ Shift Ví dụ cho C Nội dung: ``` void main() { } ``` Và đừng quên ``` ở cuối Kết quả void main() { } Ví dụ cho Pascal Nội dung: ``` Program HelloWorld; Begin WriteLn('Hello world!') {no ";" is required after the last statement of a block - adding one adds a "null stateme…

Đây ạ sao cái nội dung dưới nó lại tự định dạng luôn…

tại vì bạn dùng dấu , để ngăn cách. đây là cách để định dạng cho nhiều phần tử 1 lúc. nếu bạn muốn thể hiện thứ bậc cha con thì để dấu cách thôi.

hunter viết 10:20 ngày 01/10/2018

tại vì bạn dùng dấu , để ngăn cách. đây là cách để định dạng cho nhiều phần tử 1 lúc. nếu bạn muốn thể hiện thứ bậc cha con thì để dấu cách thôi.

nếu cách ra thì nó không định dạng nữa em đã sữa bằng cách cắt từng code ra định dạng từng cái 1. Cái em muốn là định dạng cho nhiều thành phần nhưng sau khi đã kết thúc 1 khối thì nó sẽ không ảnh hưởng tới khối khác, vậy có cách nào k ạ?

Sáng Béo viết 10:26 ngày 01/10/2018

không hiểu ý bạn lắm. Vậy bạn dùng dấu phẩy ở CSS kia với mục đích gì?

Người bị bơ viết 10:22 ngày 01/10/2018
#menu>ul, li, a{
    line-height: 40px;
    background-color: #6666FF;
    color: #fff;
    text-align: center;
    text-decoration: none;
}
#menu>li, a{
    float:left;
    width:210px;
    height: 40px;
    margin-top: -15px;
}
#menu>li, a:hover{
    background: #FFCC66;
    color: #333;
}

Có phải ý bạn tại đoạn #menu>ul, li, a là nó chọn #menu>ul, #menu>li, #menu>a không?
Nếu bạn hiểu như vậy thì :), sai rồi. Ở đây nó sẽ chọn thành #menu>ul | li | a vì vậy nó sẽ áp dụng cho tất cả thể a trong văn bản.

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

Có phải ý bạn tại đoạn #menu>ul, li, a là nó chọn #menu>ul, #menu>li, #menu>a không?Nếu bạn hiểu như vậy thì :), sai rồi. Ở đây nó sẽ chọn thành #menu>ul | li | a vì vậy nó sẽ áp dụng cho tất cả thể a trong văn bản.

oke cảm ơn bác e đã hiểu ^^!

Bài liên quan
0