Chiều rộng và chiều cao của phần tử trong CSS

Để thiết lập chiều rộng và chiều cao của phần tử trong CSS dùng các thuộc tính width và height. Giá trị của các thuộc tính này thường được đặt bằng pixel. Pixel được ký hiệu là px và thêm vào số. Ví dụ, để đặt kích thước 100 pixel, giá trị của thuộc tính cần chỉ định như sau: 100px.

Hãy xem xét hoạt động của các thuộc tính này qua một ví dụ. Hãy đặt chiều rộng cho các ô của một bảng nào đó là 200px và chiều cao là 100px:

<table border="1">
	<tr>
		<td>1</td>
		<td>2</td>
		<td>3</td>
	</tr>
	<tr>
		<td>4</td>
		<td>5</td>
		<td>6</td>
	</tr>
	<tr>
		<td>7</td>
		<td>8</td>
		<td>9</td>
	</tr>
</table>

td {
	width: 200px;
	height: 100px;
}

Tạo các đoạn văn với văn bản dài trong mã HTML. Sử dụng CSS, đặt chiều rộng cho tất cả các đoạn văn là 300px.

Cho bảng sau:

<table border="1">
	<tr>
		<td>John</td>
		<td>Smith</td>
		<td>200$</td>
	</tr>
	<tr>
		<td>Nick</td>
		<td>Mayers</td>
		<td>300$</td>
	</tr>
	<tr>
		<td>Alex</td>
		<td>Jonson</td>
		<td>400$</td>
	</tr>
</table>

Đặt chiều rộng cho các ô của bảng này là 400px và chiều cao là 300px.