search

博客列表 >【HTML】渲染方式

【HTML】渲染方式

可乐随笔
可乐随笔原创
2022年11月27日 20:50:24407浏览
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="utf-8">
  5.         <title>HTML渲染方式</title>
  6.     </head>
  8.     <body>
  10.         <!--
  11.         1. html元素按顺序显示.不能改变.
  12.         2. 元素不能改变显示顺序,但可以通过自定义布局和js改变显示位置.
  13.         3. 块元素,默认"垂直排列",占一行,包括:h1,p,div,ul,table,footer,nav等等
  14.         4. 行内元素,默认"水平排列", 自动换行,默认从左到右显示
  16.         -->
  18.         <nav style="display:inline-flex; flex-direction:row-reverse">
  19.             <!-- 改变水平排列顺序 -->
  21.         <!-- <nav style="display:grid"> -->
  22.             <!-- 改变行内元素默认水平排列为垂直排列 -->
  24.             <a href="">首页</a>
  25.             <a href="">新闻</a>
  26.             <a href="">关于</a>
  27.             <input type="search" name="search" id="">
  28.         </nav>
  30.         <!-- 
  31.         总结:
  32.         1. 排列顺序: 可以自定义
  33.         2. 元素类型: 块 block, 行内 inline, 行内块 inline-block
  34.         3. 行内块元素:通常用来描述外部资源,图像,视频,表单控件等
  35.          -->
  36.     </body>
  38. </html>
上一条：html轮播图的实现下一条：【HTML】Emmet 语法总结 [html基础]
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议

相关文章

查看更多