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

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

<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;   将某个元素转换为行内块元素

posted on 2019-01-03 22:33  AQNLWLFQ  阅读(192)  评论(0编辑  收藏  举报

导航