用CSS让img input select button 图片,文本框,下拉菜单,按扭垂直居中的方法

道一声清晨的祝福早上好!说一声清晨的关心吃早餐了吗?问一声清晨的关怀昨晚睡的好吗?真心送一句清晨的祝福愿你一天情绪愉快!
如今这世道,各大浏览器横行,杯具的是还不按套路来。
方便了广大群众,害苦了网页设计师。
说实话真怀念当年微软垄断的时代。
只有一个IE6.什么事也不会发生。
虽然IE6也是相当的垃圾...

一直以来,在HTML中,img input select button 这里元素,垂直对齐,比较难。
结果我长大了。
我发现了一个现像,其实解决这些问题只是一句话的事。
img, input, select, button{vertical-align:middle;}
如:
复制代码
代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>垂直居中测试</title>
<style type="text/css">
img, input, select, button{vertical-align:middle;}
</style>
</head>
<body>
<form name="test" method="POST">
<input type="text"name="insert" /> <img src="images/btn.gif">
</form>
</body>
</html>

本文用CSS让img input select button 图片,文本框,下拉菜单,按扭垂直居中的方法到此结束。能够拥有一份美丽的心境,不是因为我们获得的颇多,而是我们计较的很少;我们深深懂得,多,有时也是一种负担,是另外一种失去;少,并非真正不足,而是一种隐形的有余。很多的时候,我们审时度势,选择了舍弃,学会舍弃并不意味着全然失去,而是一种更宽阔更博大的获得!小编再次感谢大家对我们的支持!

您可能有感兴趣的文章
css让页脚保持在底部位置的四种方案

CSS如何使用Flex和Grid布局如何实现3D骰子

Flex布局史上最简单使用语法教程

新的CSS 伪类函数 :is() 和 :where()示例详解

纯CSS打字动画的如何实现示例