Home > front end >  Colspan and rowspan problems
Colspan and rowspan problems

Time:09-17

Colspan and rowspan problems in use process

? Teacher when you learn HTML a personal resume assignment, I want to achieve the effect of self assessment is to occupy three lines, then enter areas occupy three rows of seven columns, also, this experience also occupy three lines, input the contents of the three lines of seven columns, the code is as follows:

 & lt; ! DOCTYPE html> 


<meta charset="utf-8" & gt;
Resume & lt;/title> <br/></head> <br/><body> <br/><The table border="2" & gt; <br/><Tr> <br/><Td rowspan="3" & gt; Self assessment & lt;/td> <br/><Td colspan="7" rowspan="3" & gt; <input type="text"> </td> <br/></tr> <br/><Tr> <br/><Td rowspan="3" & gt; This experience & lt;/td> <br/><Td rowspan="3" colspan="7" & gt; <input type="text"> </td> <br/></tr> <br/><Tr> <br/><br/></tr> <br/></table> <br/></body> <br/></html> </pre> <br/><br/>? However, the final effect is like this: <br/><img SRC="https://img.codepudding.com/202009/77950170240121.png" Alt=""/> <br/><br/><br/>? Why appear such circumstance? Seek guidance<p class="article - content rp"> CodePudding user response: </p>Now I know that the solution is to use a line of a column instead of three lines of seven columns, and then use CSS to change the width is high, to achieve the same effect<p class="article - content rp"> CodePudding user response: </p>Display: flex elastic layout suddenly came out, </div> <div class="th_page th_page_color"></div> <div class="umCopyright"> <p>Page link:<a href="/frontend/5118.html" target="_blank" style="color:#999">https//www.codepudding.com/frontend/5118.html</a></p> </div> <div class="detail-arr"> <div class="detail-arr-left">Prev:<a href='/frontend/4244.html'>How to write the beginners, bosses solutions, learn from the answer</a></div> <div class="detail-arr-right">Next:<a href='/frontend/5119.html'>Canvas or tensile deformation fabricjs make pictures</a></div> </div> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="hot-tags neitags"> <ul> <li><i class="iconfont icon-x-tags"></i> Tags:  </li> <a href='/e/tags/?tagname=HTML+%28CSS%29' target='_blank'>HTML (CSS)</a> </ul> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="xiangguan"> <ul class="msg msghead"> <li class="tbname">Related</li> </ul> <ul> </ul> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="flinks"> <ul> <li><i class="iconfont icon-x-tags"></i> Links:  </li> <li class="liflinks"><a target="_blank" href="/" title="CodePudding">CodePudding</a></li> </ul> </div> </div> </div> </div> <div class="footer"> <p><span style="font-size:16px;color:#666;font-weight: bold">About Us:</span>  <a href="https://www.codepudding.com/contact.html">Contact Us</a>      <a href="https://www.codepudding.com/service.html">Terms of Service</a>      <a href="https://www.codepudding.com/privacy.html"> Privacy Policy</a></p> <p class="foot_info">Copyright © 2010-2023,Powered By <a href="/" target="_blank">CodePudding</a> </p> </div> <script type="text/javascript" src="/skin/code/tianhu.js"></script> </body></html>