Chạy Thử CSS Nhóm các phần tử giống nhau trong thẻ DIV
Chạy Thử CSS Nhóm các phần tử giống nhau trong thẻ DIV
Chạy Thử CSS Nhóm các phần tử giống nhau trong thẻ DIV
Tự code rồi chạy thử...
Chạy Thử
<!DOCTYPE html>
<html>
<head>
<title>Chạy Thử CSS Nhóm các phần tử giống nhau trong thẻ DIV</title>
<style>
#header{width:100%;float:left;height:auto;min-height:30px;bacground:red;color:#fff;margin-bottom:10px}
#khungchinh1{width:100%;float:left;height:auto;margin-bottom:10px}
#ktrai{width:80%;float:left;height:auto;min-height:200px;background:green;color:#fff}
.spham{width:24%;float:left;margin-right:1.3%;height:auto;background:#fff}
.spham1{float:right;margin-right:0px}
.hspham{width:100%;float:left;height:auto;margin-bottom:5px}
.hspham img{width:100%;float:left;height:auto}
.tenspham{width:100%;float:left;height:auto;}
.tenspham h3{color:#000;font-size:15px;font-weight:bold}
#kphai{width:20%;float:right;height:200px;background:red;color:#fff}
#footer{width:100%;height:auto;min-height:30px;background:black;color:#fff}
</style>
</head>
<body>
<h1>Chạy Thử CSS Nhóm các phần tử giống nhau trong thẻ DIV</h1>
<div id="header">Header</div>
<div id="khungchinh1">
<div id="ktrai">
<div class="spham">
<div class="hspham"><img src="https://webmoi.vn/thumb/526x274/1/upload/tinblog/the-div-trong-html.jpg" alt="sản phẩm" title="sản phẩm"></div>
<div class="tenspham"><h3>Tên sản phẩm</h3></div>
</div>
<div class="spham">
<div class="hspham"><img src="https://webmoi.vn/thumb/526x274/1/upload/tinblog/the-div-trong-html.jpg" alt="sản phẩm" title="sản phẩm"></div>
<div class="tenspham"><h3>Tên sản phẩm</h3></div>
</div>
<div class="spham">
<div class="hspham"><img src="https://webmoi.vn/thumb/526x274/1/upload/tinblog/the-div-trong-html.jpg" alt="sản phẩm" title="sản phẩm"></div>
<div class="tenspham"><h3>Tên sản phẩm</h3></div>
</div>
<div class="spham spham1">
<div class="hspham"><img src="https://webmoi.vn/thumb/526x274/1/upload/tinblog/the-div-trong-html.jpg" alt="sản phẩm" title="sản phẩm"></div>
<div class="tenspham"><h3>Tên sản phẩm</h3></div>
</div>
</div>
<div id="kphai">Khung Phải</div>
</div>
<div id="footer">Footer</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Chạy Thử CSS Nhóm các phần tử giống nhau trong thẻ DIV</title>
<style>
#header{width:100%;float:left;height:auto;min-height:30px;bacground:red;color:#fff;margin-bottom:10px}
#khungchinh1{width:100%;float:left;height:auto;margin-bottom:10px}
#ktrai{width:80%;float:left;height:auto;min-height:200px;background:green;color:#fff}
.spham{width:24%;float:left;margin-right:1.3%;height:auto;background:#fff}
.spham1{float:right;margin-right:0px}
.hspham{width:100%;float:left;height:auto;margin-bottom:5px}
.hspham img{width:100%;float:left;height:auto}
.tenspham{width:100%;float:left;height:auto;}
.tenspham h3{color:#000;font-size:15px;font-weight:bold}
#kphai{width:20%;float:right;height:200px;background:red;color:#fff}
#footer{width:100%;height:auto;min-height:30px;background:black;color:#fff}
</style>
</head>
<body>
<h1>Chạy Thử CSS Nhóm các phần tử giống nhau trong thẻ DIV</h1>
<div id="header">Header</div>
<div id="khungchinh1">
<div id="ktrai">
<div class="spham">
<div class="hspham"><img src="https://webmoi.vn/thumb/526x274/1/upload/tinblog/the-div-trong-html.jpg" alt="sản phẩm" title="sản phẩm"></div>
<div class="tenspham"><h3>Tên sản phẩm</h3></div>
</div>
<div class="spham">
<div class="hspham"><img src="https://webmoi.vn/thumb/526x274/1/upload/tinblog/the-div-trong-html.jpg" alt="sản phẩm" title="sản phẩm"></div>
<div class="tenspham"><h3>Tên sản phẩm</h3></div>
</div>
<div class="spham">
<div class="hspham"><img src="https://webmoi.vn/thumb/526x274/1/upload/tinblog/the-div-trong-html.jpg" alt="sản phẩm" title="sản phẩm"></div>
<div class="tenspham"><h3>Tên sản phẩm</h3></div>
</div>
<div class="spham spham1">
<div class="hspham"><img src="https://webmoi.vn/thumb/526x274/1/upload/tinblog/the-div-trong-html.jpg" alt="sản phẩm" title="sản phẩm"></div>
<div class="tenspham"><h3>Tên sản phẩm</h3></div>
</div>
</div>
<div id="kphai">Khung Phải</div>
</div>
<div id="footer">Footer</div>
</body>
</html>
Chạy Thử CSS Nhóm các phần tử giống nhau trong thẻ DIV nằm trong bài viết Thẻ DIV trong HTML