做登录界面的时候,要用到类似
的格式,所以会遇到三个字“用户名”和两个字“密码”对齐的问题,表面上看,只需要在“密”和“码”之间加几个空格就可以了。但是对不同的浏览器,比如IE和Google浏览器,显示出的空格的大小就不同,这样,在一个浏览器中对得很齐的空格,到另一个浏览器中看,就可能错位,从而引起后面的输入框错位;而且对于不同的字体大小,想对齐“用户名”这三个字,加的空格数量也不相同,可能不一定能精确对齐。
<wbr><wbr><wbr>但是,不同浏览器对像素的大小显示的效果是相同的,所以用<span>代替空格,能够精确设定空格的大小。在程序中,一般会遇到很多宽度不同的空格,如果都要用<span>,就要对<span>的样式编号,为了使<span>的样式清晰明确,我用像素的大小来编号,比如:</wbr></wbr></wbr>
CSS:
span.bank2
{
<wbr>padding-left:2px;<br> }<br> span.bank5<br> {<br><wbr>padding-left:5px;<br> }<br> span.bank15<br> {<br><wbr>padding-left:15px;<br> }</wbr></wbr></wbr>
<wbr><wbr><wbr><wbr>这样,在给<span>选择class的时候就很明确。以下是实现方法:</wbr></wbr></wbr></wbr>
html:
<label for="username">用户名:</label>
<label for="password">密<span class="bank15"></span>码:</label>
<wbr><wbr><wbr>最好的方法是将单位“px”换成大小相近的“em”,这样,如果用户在浏览器的工具栏“查看”-》“文字大小”中改变文字大小,文字间的空隙也会相应变化,不影响对齐。</wbr></wbr></wbr>
相关推荐
使用js+div+span实现树型结构 非常简单的代码 一看就懂 下载解压直接打开就可以看出效果
span:较旧的编译器的C ++ 20 std :: span实现
这是一期分享 HTML 中 span 标签,如何设置宽度的问题。 span标签 span 表示行内元素,相当于 inline 属性,只会根据元素的宽度自行...使用 float 属性,设置属性为 span{float:left} ,呈现的效果如下: 由于 flo
FESTO 压力传感器 SPAN手册
RichEditor基于原生EditText + span实现的Android富文本编辑器组件描述该组件是基于原生EditText + span的方式实现的,逐步提供一个功能齐全且使用方便的Android富文本编辑器。主要支持了加粗斜体等行内样式,标题...
在写JS代码的时候,大家可以会发现这样现象: [removed]( 1 2 3 ); 结果: 1 2 3 无论在输出的内容中什么位置有多少个空格,显示的结果好像只有一个空格。...[removed](<span xss=removed>+ 1 2 3 +</
带图片背景的span
之前我们介绍过几款具有各种动画效果的CSS3进度条,我们可以在CSS3进度条栏目...今天我们再介绍一款实现超级简单的CSS3进度条动画,该进度条是条形进度条,仅用了6个span标签和相应的CSS3代码实现了该CSS3条形进度条。
div: div是一个块级元素,可以包含段落,表格等内容,用于放置不同的...span是一个内联元素,没有实际意义,它的存在纯粹是为了应用样式,给一段内容加上<span></span>标记可以通过在span上定义样式来设定其内容的样
span标签超长部分隐藏
CISCO官方配置手册SPAN
span 鼠标移上动画提示弹窗,包含不同颜色不同场景,有多种样式可供选择
HTML 代码中的所有连续的空格或空行(换行)都会被显示为一个空格。 例子1:(文本内容中的连续空格) 代码 ... 这段文本中,输入连续的空格 大概输入了十个。... <span>span是一个行内标签</span> <span>和前面的sp
SPAN Plus为您提供了一个非常灵活的“模式”系统,您可以使用它来设置您的频谱分析仪偏好。你可以指定样本的傅里叶块大小,FFT窗口重叠百分比,光谱的视觉斜率。此外,您可以选择显示所需类型的次级频谱(例如,实时...
为研究非离子表面活性剂在煤泥浮选中的促进作用,采用SPAN80和煤油配成组合捕收剂,并改变其配比、用量,进行了煤泥浮选试验,结果表明:SPAN80可显著改善捕收剂性能,提高精煤产率和尾煤灰分,降低煤油的消耗,具有较好的...
Switch 上配置SPAN(监听端口)特性
【动画消消乐|CSS】082.单span标签实现自定义简易过渡动画
仅6个span标签实现的纯CSS3动态Loading加载特效源码.zip
博文 “display:block-inline形式的Span或Div中添加文字后,导致Span或Div排版掉落、错位”的原因及解决方法 里的示例代码