一、块元素
常见的块元素有<h1>-<h6>、<div>、<ul>、<ol>、<li>等,其中<div>标签是常见的块元素。
<!DOCTYPE html><html lang=\"en\"><head><meta charset=\"UTF-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><title>块元素</title><style>div{background-color: blue;height: 100px;}</style></head><body><div>比较霸道,自己占一行</div>瑟瑟发抖</body></html>
二、行内元素
常见的行内元素有<a>、<strong>、<b>、<em>、<i>、<del>、<s>、<ins>、<u>、<span>等,其中<span>标签是最典型的行内元素,有些地方也将行内元素称为内联元素。
<!DOCTYPE html><html lang=\"en\"><head><meta charset=\"UTF-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><title>行内元素</title><style>span {width: 30px;height: 30px;background-color: #666666;}</style></head><body><span>tttt</span><strong>htht</strong><del>fhjtjt</del></body></html>
三、行内块元素
<!DOCTYPE html><html lang=\"en\"><head><meta charset=\"UTF-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><title>行内块元素</title><style>input{width: 249px;height: 36px;}</style></head><body><input type=\"text\"><input type=\"text\"></body></html>