行内块元素(文图来源于CSDN)

普遍的规则里总有那么几个不一样的,在行内元素中就有那么几个特殊标签,比如<img>/<input>/<td>,可以给他们设置宽高、对齐属性,我们把这样特殊的一类标签称为行内块元素。行内块元素综合了块元素和行内元素的不同特点。

行内块元素的特点:

和相邻行内元素在同一行,但是之间会有空白缝隙。

默认宽度是他本身内容的宽度。

宽度、高度、行高、外边距以及内边距都可以手动设置。

样式:

/*行内块元素input*/

input{

    width: 200px;      /*宽高均有效*/

    height: 30px;

}

<input type="text" value="行内块元素1"> 

<input type="text" value="行内块元素行内块元素2行内块元素">

综合效果图如下:


©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,682评论 1 92
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 28,019评论 1 45
  • 一、CSS入门 1、css选择器 选择器的作用是“用于确定(选定)要进行样式设定的标签(元素)”。 有若干种形式的...
    宠辱不惊丶岁月静好阅读 5,542评论 0 6
  • 前言: 1.HTML5的发展非常迅速,可以说已经是前端开发人员的标配,在电商类型的APP中更是运用广泛,这个系列的...
    珍此良辰阅读 5,884评论 2 15
  • 课程目标: 学会使用CSS选择器熟记CSS样式和外观属性熟练掌握CSS各种选择器熟练掌握CSS各种选择器熟练掌握C...
    繁华退却阅读 5,678评论 0 0