发表于: 2017-03-29 20:35:16

2 594


今天完成的事情:完成任务4


明天计划的事情:完成任务5布局,并调试样式(学习flex)



遇到的问题:

1.input输入框不能居中

解决:使用绝对定位加相对定位方式实现

即,父类元素使用绝对定位(外层div),子类元素(input)使用相对定位来实现。子类元素默认停靠在父类元素的下方,通过指定left和top值来固定input位置。

2. 图片位置的竖线实现,通过设置图片的<div>的边框border-right实现。


收获:

父元素高度确定的多行文本垂直居中方法;

  1. 使用table标签同时使用vertical-align:middle

<body>

<table><tbody><tr><td class=“warp”>

<div>

<p>这里是文本</p>

</div>

</td></tr></tbody><table>

css:

table {height: 500px; background:read}

2. 将子元素设置为table-cell,就可以用vertical-align:middle来实现居中。

3.单行文本可以设置父元素的高weight和子元素的行高inline-height一致来实现;




返回列表 返回列表
评论

    分享到