1 つの列は固定され、1 つの列の幅は適応的です:
推奨: コードをできるだけ手書きすることで、学習の効率と深さを効果的に向上させることができます。
前のコードでは、1 列幅の適応と 2 列幅の適応が導入されました。適応の効果は、一般に、対応するオブジェクトの幅をパーセンテージの形式で表すことです。実際のレイアウトでは、1 つの列は固定幅、もう 1 つの列は適応幅になります。左側の div が固定幅で、右側の div が適応幅を持つ例を考えてみましょう。
コード例:
<!DOCTYPE html><html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>蚂蚁部落</title> <style type="text/css">body{ margin:0px; padding:0px;}.left{ width:200px; height:50px; background-color:green; position:absolute; left:0px;}.right{ height:50px; background-color:blue; margin-left:200px;}</style></head><body><div class="left">我是左边</div><div class="right">我是右边</div></body></html>上記のコードでは、左列 div の幅は 200px の固定値であり、ドキュメント フローの外に絶対的に配置され、周囲の div。このとき、右 div の左マージンを左 div の幅と同じに設定し、自己幅使用の効果を実現するためにこの div の幅を設定しないでください。
元のアドレスは次のとおりです: http://www.softwhy.com/forum.php?mod=viewthread&tid=4767
詳細については、以下を参照してください: http://www.softwhy.com/divcss/
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
