网页结构

HTML基本框架：
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <title></title>
  5. </head>
  6. <body>
  7. </body>
  8. </html>
常用的样式属性：
文本属性：
  1. font-size：字体大小
  2. font-family：字体类型
  3. font-style：字体样式
  4. color：字体颜色
  5. text-algin：文本的对齐方式
 
背景属性：
  1. backgroud-color：背景颜色
  2. backgroud-image：URL（图片地址）背景图片
  3. backgroud-repeat：（repeat/no-repeat/repeat-x/repeat-y）背景图片如何被重复显示

方框属性：

  1. margin-left：设置对象的左边距
  2. margin-right：设置对象的右边距
  3. margin-top：设置对象的上边距
  4. margin-buttom：设置对象的下边距
  5. padding-left：设置内容与左边框之间的距离
  6. padding-right：设置内容与右边框之间的距离
  7. padding-top：设置内容与上边框之间的距离
  8. padding-buttom：设置内容与下边框之间的距离
  9. border-style：（soild细边框/dashed虚边框）边框样式
  10. border-width：边框宽度
  11. border-color：边框颜色
  12. a:link{}未被访问的链接样式
  13. a:visited{}被访问过的链接样式
  14. a:hover{}鼠标悬浮在链接上时的样式
  15. a:active{}鼠标在按下是链接文字的样式
  16. 注释 <!--注释内容-->
  17. 加粗--<b>....</b> 倾斜-<i>....</i> 语气(加粗)--<strong>...</strong>
  18. 加强语气(倾斜)--<em>....</em> 下划线--<u>...</u> 删除线--<s>...</s> 上标--<sup>...</sup> 下标--<sub>...</sub>
  19. <br />标签表示一个换行标签
  20. <hr />标签是水平线标签
  21. < img />标签是图片标签
  22. <a>标签是超链接标签
  23. <span>标签主要用来对行内的文字进行一些样式以及其他的操作
  24. <em>标签一般用来对文字进行强调，使用斜体体现出来
  25. <p>标签段落标签，段落文字使用，默认格式：段尾进行换行
  26. <ul>标签无序列表的主标签，后面的标号为圆点（黑色）
  27. <div> 标签可定义文档中的分区或节，把文档分割成独立的、不同的部分,划分块的主要使用标签
  28. <span> 标签被用来组合文档中的行内元素。
  29. <ol>标签有序列表的主标签
  30. <li>标签列表中的主体使用标签
  31. <dl>标签自定义标签的主标签
  32. <dt>标签自定义标签的表头
  33. <dd>标签自定义标签的表头的解释（描述）信息
  34. <h1~h6>：6级标题标签、字体的大小依次变小
  35. 行内标签：包含a、span、em、strong、b、i、u、label、br；特点：可以多个标签存在一行，不能直接设置行内标签的高度、宽度、行高以及顶和底边距，完全靠内容撑开宽高！
  36. 块标签：包含p、div、ul、ol、li、dl、dt、dd、h1~h6、form；特点：独占一行，对高度、宽度、行高以及顶和底边距都可设置的属性值生效；如果不给宽度，块级元素就默认为浏览器的宽度，即就是100%宽；
  37. 行内块标签：img,input,textarea 特点：结合的行内和块级的有点，不仅可以对宽高属性值生效，还可以多个标签存在一行显示；
  38. 块级标签转换为行内标签：display:inline;
  39. 行内标签转换为块级标签：display:block;
  40. 转换为行内块标签：display：inline-block;
posted @ 2020-09-06 09:53  陈冲冲  阅读(12)  评论(0)    收藏  举报