338day（css开发习惯）-优快云博客

本文链接：https://blog.youkuaiyun.com/orangecloudy/article/details/82441205

本文介绍了CSS中三种基本元素类型——行级元素、块级元素和行级块元素的特点及应用，并通过具体示例展示了如何利用这些元素进行网页布局。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

《2018年9月6日》【连续338天】

标题：css开发习惯；
内容：

<!DOCTYPE html>
<html>
<head>
	<title>t3</title>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="t2.css">
</head>
<body>
    <div>层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
    </div>
    <del>原价50元</del>
    <span>原价50元</span>
    <hr>
    <a href="https://www.baidu.com">www.baidu.com</a>
    <span>www.baidu.com</span>
    <a href="https://taobao.com">www.taobao.com</a>
    <!-- 1.行级元素/ 内联元素 inline
    feature：内容决定元素所占位置，不可以通过css改变宽高
    span strong em a del
    2.块级元素 block
    feature：独占一行，可以通过css改变宽高
    div p ul li ol form address
    3.行级块元素 inline-block
    feature：内容决定大小，可以改宽高
    img
    这些都是css属性，可在display里调节；
    -->
    <!-- 先有功能 -->
    <div class="red size1"></div>
    <div class="gray size2"></div>
    <div class="green size1"></div>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
	<title>t3</title>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="t2.css">
</head>
<body>
    <div>层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
    </div>
    <del>原价50元</del>
    <span>原价50元</span>
    <hr>
    <a href="https://www.baidu.com">www.baidu.com</a>
    <span>www.baidu.com</span>
    <a href="https://taobao.com">www.taobao.com</a>
    <!-- 1.行级元素/ 内联元素 inline
    feature：内容决定元素所占位置，不可以通过css改变宽高
    span strong em a del
    2.块级元素 block
    feature：独占一行，可以通过css改变宽高
    div p ul li ol form address
    3.行级块元素 inline-block
    feature：内容决定大小，可以改宽高
    img
    这些都是css属性，可在display里调节；
    -->
    <!-- 先有功能 -->
    <div class="red size1"></div>
    <div class="gray size2"></div>
    <div class="green size1"></div>
</body>
</html>