行内元素可以设置padding和margin吗

第一:行内元素与宽度
宽度不起作用
span {
width:200px;
}没有变化

第二:行内元素与高度
高度不起作用
span{
height:200px;
}
没用变化

第三:行内元素与padding,margin
span{
padding:200px;
}
影响左右,不影响上下
行内元素(inline-block)的padding左右有效 ,但是由于设置padding上下不占页面空间,无法显示效果,所以无效。其margin-top和padding-bottom上下会合并,所以不建议使用。

原文地址:http://blog.51cto.com/13550695/2116129

时间: 2024-07-31 23:32:01

行内元素可以设置padding和margin吗的相关文章

行内元素能设置宽高吗

除了行内非替换元素,table-rows,and row groups 其他元素都能设置宽 除了行内非替换元素,table-colums,colum-groups 其他元素都能设置高 行内元素包含行内替换元素(img等)和行内非替换元素(a span等) 行内替换元素是可以设置宽高的,行内非替换元素是不能设置宽高的. 当给行内元素设置 float:left; float:right; 或者 position:absolute; position:fixed; 行内非替换元素也是可以设置宽高的,究

为什么有些行内元素可以设置宽高

元素是文档结构的基础,在CSS中,每个元素生成了一个包含了元素内容的框(box,也译为“盒子”).但是不同的元素显示的方式会有所不同,例如<div>和<span>就不同,而<strong>和<p>也不一样.在文档类型定义(DTD)中对不同的元素规定了不同的类型,这也是DTD对文档之所以重要的原因之一. 1. 替换和不可替换元素 从元素本身的特点来讲,可以分为替换和不可替换元素. a) 替换元素 替换元素就是浏览器根据元素的标签和属性,来决定元素的具体显示内容

行内元素的上下margin 和 img元素的上下margin

行内元素的特点有: 1.与其他元素在同一行 2.宽度(width).高度(height).内边距的top/bottom(padding-top/padding-bottom)和外边距的top/bottom(margin-top/margin-bottom)不可设置 其实这4个属性是可以设置的,但是不建议设置. 如以下代码所示,给行内元素a设置 margin-top:20px;margin-right:20px; 样式中简写为margin:20px 20px 0 0; padding-top:5p

行内元素和块级元素的区别

一.行内元素和块级元素的区别 1. 行内元素不会占据整行,在一条直线上排列,都是同一行,水平方向排列: 块级元素会占据一行,垂直方向排列. 2. 块级元素可以包含行内元素和块级元素:行内元素不能包含块级元素. 3. 行内元素与块级元素属性的不同,主要是盒模型属性上,行内元素设置width无效,height无效(可以设置line-height),margin上下无效,padding上下无效. 二.行内元素和块级元素的相互转换 行内元素转化为块元素: display:block; 块元素转化为行内元

3、第3课CSS块级、行内元素、绝对定位、相对定位、固定位置20150922

1.块级元素 A:特点: A.1默认显示在父标签的左上角 A.2块级元素默认占满一行(占满整个文档流) B:常见的块级元素 P   h1--h6   ul  li    ol  li   div  hr    table 2.行内元素(内联元素) A:常见的=行内元素有 a  span  img   input B:行内元素的特点 B.1 大小受到文字区域影响,不受width  height 影响 B.2 行内元素不会单独占满一行 3. 行内元素和块级元素相互转换 A:  行内元素转换成块级元素

li标签行内元素高度及居中

<head> <title><title> <style type="text/css"> * { padding: 0px; margin: 0px; } li { list-style-type: none; width: 150px; float: left; line-height: 80px;/*行内元素不能设置高度,但可以设置行高*/ text-align: center;/*让li内的内容水平居中,行内元素默认垂直居中*/

HTML的display属性将行内元素、块状元素、行内块状元素互相转换以及三者的区别

1.行内元素 (1)设置宽高无效 (2)对margin仅设置左右方向有效,上下无效:padding设置上下左右都有效,即会撑大空间 (3)不会自动进行换行 <html> <head> <meta charset="utf-8" /> <title>行内元素</title> <style type="text/css"> span { width: 120px; /*设置宽高无效*/ height

从块级元素和行内元素的分析到bfc的布局理解

接口和属性介绍 播放器提供了progressMakers属性,是一个数组类型,每一条记录包含offset时间和text打点的内容,还可以包含其他属性,此属性用于告诉播放器进度条打点记录,记录内容属性说明: 名称 类型 说明 offset Number 打点的视频偏移时间,单位:秒 text String 打点的文本信息,默认UI会使用 isCustomized Boolean 是否使用默认UI,不使用设置为true 事件 Aliplayer提供两个事件:鼠标进入进度条上的打点和鼠标离开进度条上的

行内元素,块级元素

1.行内元素不会应用width和height属性,可以设置line-height. 2.行内元素margin-left,margin-right,padding-left,padding-right有效 3.对于块级元素,未浮动的垂直相邻元素的上边界和下边界会被压缩. 4.通过display:block;或display:inline-block;行内元素可以设置块级元素才能定义的css属性.通过display:inline;块级元素转变行内元素. 注:替换元素是只用来替换元素内容的部分并非由文