CSS教程 行内元素和块元素的互相转换

 时间:2026-02-14 03:24:40

1、新建一个 InlineBlock.html 文件,如图所示:

CSS教程 行内元素和块元素的互相转换

2、输入HTML5的结构代码,将title标签里面的内容修改成:InlineBlock,如图所示:

CSS教程 行内元素和块元素的互相转换

3、display: inline的作用:转为行内元素,如图所示:

CSS教程 行内元素和块元素的互相转换

4、display: block的作用:转换块元素,如图所示:

CSS教程 行内元素和块元素的互相转换

5、定义一个span和div,并且使用inline和block改变他们的状态,如图所示:

CSS教程 行内元素和块元素的互相转换

6、运行网页,可以看到块元素变成了行元素,行元素变成块元素,如图所示:

CSS教程 行内元素和块元素的互相转换

  • php之cookie的使用-统计访问次数
  • 如何用css做出固定大小的表格?
  • 如何使用HTML5编写的移动端仿淘宝页面
  • 用记事本编写简单html网页入门:[2]列表
  • 如何利用HTML5和CSS3制作图片列表并展示效果
  • 热门搜索
    爻是什么意思 usb是什么 胸膜炎什么症状 上善若水什么意思 郑人买履告诉我们什么道理 fresh是什么意思 上元节是什么节日 马甲线是什么 9月20日是什么星座 普天同庆是什么意思