ਲਿਸਟ ਨੂੰ ਮੱਧਮਾਂ ਵਿੱਚ ਕਿਵੇਂ ਕਰਨਾ ਹੈ

ਐੱਸੀਐੱਸ ਨਾਲ ਲਿਸਟ ਮੱਧਮਾਂ ਨੂੰ ਮੱਧਮਾਂ ਵਿੱਚ ਕਿਵੇਂ ਵਰਤਣਾ ਹੈ ਸਿੱਖੋ

ਐੱਚਟੀਐੱਮਐੱਲ ਲਿਸਟ ਮੱਧਮਾਂ ਲਈ ਸਥਾਨਾਂ ਵਿੱਚ ਰਾਖਵਾਂਕਰਨ ਕਰੋ

ਪਹਿਲਾ ਕਦਮ - ਐੱਚਟੀਐੱਮਐੱਲ ਜੋੜੋ:

ਨੂੰ ਬਦਲੋ <ul> ਐਲੀਮੈਂਟ ਨੂੰ ਕੰਟੇਨਰ ਐਲੀਮੈਂਟ ਵਿੱਚ ਬੰਦ ਕਰੋ, ਜਿਵੇਂ ਕਿ <div>:

<div class="container">
  <ul class="myUL">
    <li>ਕਾਫੀ</li>
    <li>ਚਾਯਾ</li>
    <li>ਕੋਲਾ</li>
  </ul>
</div>

ਦੂਜਾ ਕਦਮ - ਐੱਸੀਐੱਸ ਜੋੜੋ:

ਨੂੰ ਬਦਲੋ <div> ਐਲੀਮੈਂਟ ਮੱਧਮਾਂ ਲਈ ਸਥਾਨਾਂ ਵਿੱਚ ਰਾਖਵਾਂਕਰਨ ਕਰੋ, ਅਤੇ <ul> ਦੇ ਪ੍ਰਦਰਸ਼ਨ ਨੂੰ ਬਦਲੋ inline-block。

ਜਾਂ ਤੁਸੀਂ ਸਾਥੀ ਲਿਸਟ ਅਇਟਮਜ਼ ਨੂੰ ਲੰਬੇ ਦਿਖਾਉਣ ਲਈ ਖੱਲ੍ਹੇ ਮੈਗਨੇਟਿਕ ਲਾਈਨ ਵਰਤ ਸਕਦੇ ਹੋ:

div.container {
  text-align: center;
{}
ul.myUL {
  display: inline-block;
  text-align: left;
{}

亲自试一试

相关页面

教程：CSS 对齐