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

 时间:2024-10-14 14:06:28

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制作图片列表并展示效果
  • 热门搜索
    地球仪怎么做 悦木之源怎么样 itunes怎么读音 温州大学怎么样 金发科技怎么样 怎么提高精子质量 怎么清空回收站 怎么杀鱼 电脑缓存怎么清理 手动挡的车怎么开