Sublime Text
<!DOCTYPE html> <html> <head> <style type="text/css"> .father{ max-width:50%; } .child{ background-color:yellow; max-width:inherit; } </style> </head> <body> <div class="father"> <h3 class="child">- Lập Trình Web</h3> </div> <p>- <i><u>GIẢI THÍCH</u>:</i> Giá trị thuộc tính max-width của phần tử .child sẽ kế thừa giá trị thuộc tính max-width từ phần tử cha của nó (tức là phần tử .father), khi đó giá trị thuộc tính max-width của phần tử .child sẽ là "50%". Mà phần tử .father có chiều rộng bằng 50% chiều rộng phần nội dung của phần tử <body>, trong khi phần tử .child có chiều rộng bằng 50% chiều rộng của phần tử .father, cho nên phần tử .child có chiều rộng khoảng 25% chiều rộng phần nội dung của phần tử <body></p> </body> </html>
<!DOCTYPE html> <html> <head> <style type="text/css"> .father{ max-width:50%; } .child{ background-color:yellow; max-width:inherit; } </style> </head> <body> <div class="father"> <h3 class="child">- Lập Trình Web</h3> </div> <p>- <i><u>GIẢI THÍCH</u>:</i> Giá trị thuộc tính max-width của phần tử .child sẽ kế thừa giá trị thuộc tính max-width từ phần tử cha của nó (tức là phần tử .father), khi đó giá trị thuộc tính max-width của phần tử .child sẽ là "50%". Mà phần tử .father có chiều rộng bằng 50% chiều rộng phần nội dung của phần tử <body>, trong khi phần tử .child có chiều rộng bằng 50% chiều rộng của phần tử .father, cho nên phần tử .child có chiều rộng khoảng 25% chiều rộng phần nội dung của phần tử <body></p> </body> </html>