静态页面文本框首行缩进实现

<input type=“text”>创立一个文本框,加入placeholder给文本框内加入默认文字，使用text-indent对首行进行相关缩进，会发现，当数字输入过多时会覆盖前面。

这里使用text-indent是不合适的，使用padding-left进行首行缩进。

区号+86定位实现：
css里对+86进行绝对定位position: absolute;每当进行绝对定位时，应条件反射在包裹此元素的父集添加pasition:relative相对定位元素，如果上级元素已经是定位元素，就没必要在写。
+86右边框设置，border-right:1px solid #060
+86居中text-align：center行盒文字居中。

	ps：第一次写博客，有些不明不白，望大佬们指出。

<div class="a11">
                <input type="text" class="a123" placeholder="手机">
                <div class="a86">
                    +86
                </div>
            </div>

.container .a86{
    position: absolute;
    border-right: 1px solid #060;
    width: 51px;
    height: 26px;
    top: 3px;
    left: 3px;
    text-align: center;/*行盒居中*/
    font-weight: bold;
    cursor: pointer;
}

.container .a123{
    padding-left: 56px;/*进行首行缩进*/
}

.container .a11{
    position: relative;
}