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制作图片列表并展示效果
  • 热门搜索
    质量分数怎么算 人工学院2怎么玩 面部毛孔粗大怎么办 儿童近视怎么办 wifi怎么设置 怎么唱高音 创业板怎么开户 同时用英语怎么说 手脚冰凉是怎么回事 怎么炒股新手入门