欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

客户端相关行级元素、块级元素的学习

程序员文章站 2022-05-03 11:45:02
行级元素:行内元素宽高自动设置(设置了宽高也不起作用),并排显示 .................:链接 ...... :缩写 .................:加粗 ................. : 短引用 ... ......

行级元素:行内元素宽高自动设置(设置了宽高也不起作用),并排显示

<a>.................</a>:链接

<abbr>...... </abbr>:缩写

<b>.................</b>:加粗

<q>.................</q> : 短引用

<i>......................</i> :斜体

<u>...................</u>  :下划线

<br/>        : 换行

<del>.....</del>       :删除线

<code>.....</code>  : 计算机代码(在引用源码的时候需要)

<strong>.....</strong>:加粗

<img>                :图片

<sup>.....</sup>:上标

<sub>.....</sub>:下标 

<input>.....</input>:文本框

<textarea>.....</textarea>:多行文本

<select>....</select>:下拉列表

<span>....</span>  :通过span可以自定义效果样式

块级元素:独占一行(当内容占满一行时,会自动添加下一行)

<header>.....</header>     :  某个区域头部
<nav>................</nav> :导航栏
<article>........</article>   :  一个整体的一部分信息
<section>.....</section>     :  表示右边的侧边栏
<aside>...........</aside>     :  周围相关主题附加信息
<footer>..........</footer>     :  某个区域的脚注

<h1></h1>     :一级标题

<h2></h2>     :二级标题

<h3></h3>     :三级标题

<h4></h4>     :四级标题

<h5></h5>     :五级标题

<h6></h6>     :六级标题

<hr/>              :水平分割线

<pre></pre>    :预设文本格式化

<blockquote>  </blockquote>    :段落缩进,前后5个字符

<marquee></marquee>   :滚动文本

<ul>.....</ul>     :无序列表

<ol>.....</ol>     :有序列表

<dl>.....</dl>     :定义列表

<p>.....</p>        : 段落

<div>.....</div>   : 

<table></table>  : 表格

<form></form>   : 表单

附加学习内容(下面都是实用块级,行级,行内块级的转换)

display:inline;   将某个元素转换为行级元素

display:block;   将某个元素转换为块级元素

display:inline-block;   将某个元素转换为行内块元素