网页制作之css行内元素、块元素

  • 时间:2018-11-13 23:29 作者:小牛试讲 来源:小牛试讲 阅读:903
  • 扫一扫,手机访问
摘要:视频加载中...得出区别的方法: 1. 写两个div,两个span 2. 分别对div 与span 设置背景看效果 3. 分别设置宽度看效果 4. 加margin看效果1).区别页面中元素一般分为两种:块级元素,行内元素(内联元素),既然分为两种元素,那么他们之间必然有区别: A. 块级元素总是独自

视频加载中...

得出区别的方法:

1. 写两个div,两个span

2. 分别对div 与span 设置背景看效果

3. 分别设置宽度看效果

4. 加margin看效果

1).区别

页面中元素一般分为两种:块级元素,行内元素(内联元素),既然分为两种元素,那么他们之间必然有区别:

A. 块级元素总是独自占一行,前面和后面就如同有个换行符,内联元素总是和其它的内联兄弟占一行

B. 块级元素可以设置宽和高度值,内联元素就不行了,他们的宽和高总是随着自身的内容自动扩大和缩小

C. 块级元素的margin和padding都正常,内联元素左右margin和左右padding正常,上下不正常不识别,也就是说不能通过margin-top和padding-top来改变行高

D. 网页布局时,块级元素可包含内联元素和其它块级元素;而内联元素只可包含内联元素和文本等,不可包含块级元素。我们可以了解为内容标记和结构标记。

2)、常用的块级元素和行内元素有:

块级元素:h1至h6,div p ul dl dt dd form table等

行内元素:strong em span b I a img input等

3)、相互转化

想让自己独占一行就用块级元素(div,dl,dt,dd,ul,li...),想让元素和其它元素在一行就用行内元素(span,a,img)。

他们之间可以通过样式来转换:

display:block;

display:inline;

display:inline-block;

将对象呈递为内联元素,与其它的元素同处一行,但是内部又呈现出块级元素,也就是可以设置宽度和高度,打破了块级元素和内联元素的区别。

  • 全部评论(0)
最新发布的资讯信息
【系统环境|】怎么做才能建设好外贸网站?(2023-12-20 10:05)
【系统环境|软件环境】梦幻仙域游戏攻略(2023-12-19 10:02)
【系统环境|软件环境】梦幻仙域游戏攻略(2023-12-19 10:02)
【系统环境|】卡帕部落揭秘潮玩新宠,探究玩法(2023-12-14 09:45)
【系统环境|数据库】 潮玩宇宙游戏道具收集方法(2023-12-12 16:13)
【系统环境|】如何开发搭建卡帕部落模式源码(2023-12-12 10:44)
【系统环境|】遥遥领先!青否数字人直播系统5.0发布,支持真人接管实时驱动!(2023-10-12 17:31)
【系统环境|服务器应用】克隆自己的数字人形象需要几步?(2023-09-20 17:13)
【系统环境|】Tiktok登录教程(2023-02-13 14:17)
【系统环境|】ZORRO佐罗软件安装教程及一键新机使用方法详细简介(2023-02-10 21:56)
手机二维码手机访问领取大礼包
返回顶部