关于vertical-align属性我有一个问题为什么不能直接在p标签里添加该属性使这段内容居中呢
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>文本样式</title>
<style type="text/css">
p{background:#eee;text-align:center;line-height:5em;font-size:2em;font-family:宋体;}
img{vertical-align:middle;}
.one{font-size:2em;vertical-align:middle;}
.tow{color:red;vertical-align:middle;text-decoration:underline;}
/*写出CSS样式*/
</style>
</head>
<body>
<p><img src=" http://img1.sycdn.imooc.com/climg//59c21bae000157fa01000059.jpg">
<span class="one">CSS层叠样式表</span>
<span class="tow">(Cascading style sheets)</span>
</p> <!--写出html代码-->
</body>
</html>
正在回答
该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐,假设有两个行内元素a和b,a和b都是img,当a加了一个vertical-align:middle样式之后,b的底部(基线)就会对齐a的中间位置,如果a和b都加了一个vertical-align:middle样式,那么就互相对齐了对方的中间位置,也就是它们在垂直方向上的中线对齐了
祝学习愉快!
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36713 个
从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星