主要使用： text-align-last: justify;
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>對齊</title>
<style>
body, html {
margin: 0;
padding: 0;
box-sizing: border-box;
}
section {
display: inline-block;
width: 1400px;
display: flex;
}
.box {
width: 700px;
display: inline-block;
text-align-last: justify;
display: flex;
border: 1px solid #999;
}
.box_1 {
display: inline-block;
width: 90px;
margin-right: 32px;
}
.box_2 {
display: inline-block;
width: 500px;
}
</style>
</head>
<body>
<!--輸入框中只可以輸入正數(shù)小數(shù)和0-->
<input type="text" placeholder="入正數(shù)小數(shù)和0" onkeyup="this.value=this.value.replace(/[^0-9.]/g,'')"/>
<!--只可以輸入正整數(shù)和0-->
<input type="text" placeholder="正整數(shù)和0" onKeyUp="value=value.replace(/\D/g,'')"/>
<!--只可以輸入中文-->
<input type="text" placeholder="中文" onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')">
<!--只可以輸入英文-->
<input type="text" placeholder="英文" onkeyup="value=value.replace(/[^\a-\z\A-\Z]/g,'')">
<!--開頭不出現(xiàn)空格-->
<input type="text" oninput="this.value = this.value.trim()" placeholder="不出現(xiàn)空格">
<!--可以輸入正數(shù)蒋腮，負(fù)數(shù) 小數(shù)-->
<input type="text" placeholder='數(shù)字' onkeyup="this.value=this.value.replace(/[^\-?\d.]/g,'')"/>
<!--英文和數(shù)字-->
<input type="text" name="username" placeholder="英文和數(shù)字" onkeyup="value=value.replace(/[^\w\.\/]/ig,'')"/>
<div style="height: 50px;background-color: #2c3e50">
</div>
<section>
<div class="box">
<div class="box_1"><label :for="#">姓名</label>:</div>
<div class="box_2">
你好
</div>
</div>
<div class="box">
<div class="box_1"><label :for="#">姓名</label>:</div>
<div class="box_2">
姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名
</div>
</div>
</section>
<section>
<div class="box">
<div class="box_1"><label :for="#">工作單位</label>:</div>
<div class="box_2">
姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名姓名
</div>
</div>
<div class="box">
<div class="box_1"><label :for="#">姓行名</label>:</div>
<div class="box_2">
姓名姓名姓名姓名姓名姓名姓名姓名姓名
</div>
</div>
</section>
</body>
</html>
<script>
function a() {
b();
console.log('我是a1')
function b() {
c();
console.log('我是b1')
function c() {
d();
console.log('我是c1')
function d() {
console.log('我是d')
}
}
}
console.log('我是a2')
}
a();
</script>
