Day2



1·有序和无序列表

<ol> </ol>:有序列表标签

<ul> </ul>:无序列表标签

<ol>

   <li>填写个人信息</li>

   <li>填写学历信息</li>

   <li>填写家人信息</li>

</ol>

              1.填写个人信息

              2.填写学历信息

              3.填写家人信息

<ul>

   <li>篮球</li>

   <li>足球</li>

   <li>网球</li>

</ul>

• 篮球
• 足球
• 网球                        （无序列表中嵌入无序列表时会自动改变符号区分）

凡是父子关系都需缩进

两种列表标签可以相互嵌入 同种列表标签页可以嵌入

不同级的项目可以用“../”来倒级实现共享资源

2·定义列表

<dl>                   定义列表标签

      <dt>---<.dt> 标题标签    （嵌套img标签可以添加图片）

      <dd>---<dd>描述标签

<dl>

3·组合标签

<figure>                                       组合标签

          <img  src---->                               图

          <figcaption>---------</figcaption>  文

</figure>                      让图片和文字左对齐

4·分区标签        <div>------</div>

<!--style:属性

    height：100px

    div默认没有样式，无法直接被用户看到，让div显示的方法有两个

    1：加边框  border   （可能对后期的页面布局产生影响）

       border：有三个属性值（顺序可任意写）：

       （1）：边框的宽度

       （2）：边框的颜色

       （3）：边框的样式

       border：1px red solid；

    2：加背景颜色：background-color

        background-color：red-->

5·行级标签

（1）<p>文本1<span style--->文本2</span>文本3</p> 可为文本2添加特殊属性且不会独占一行

示例：

<p>商品价格：仅售

   <spanstyle="color:yellow;font-size:32px">10</span>

   元。仅限<spanstyle="color:green;font-size:64px">11月11日一天!</span>

   还有机会赢得<spanstyle="font-size:48px;color:blue">现金红包!</span>

商品价格：仅售 10 元。仅限11月11日一天! 还有机会赢得现金红包!

（2）em 强调 斜体                     i 斜体

         strong  强调  加粗              b加粗

        q    短引用 给文本添加引号包裹

small 比前一个小         big 比前一个大

6·a标签

a标签的基础语法：<a herf="mailto:[e-mail]>给陈老发邮件</a>

cc 抄送  bcc 密送  subject 主题  body 内容

<a href="mailto:[e-mail]?cc=[e-mail]">  添加抄送

<a href="mailto:[e-mail]?bcc=[e-mail]"> 添加密送

<a href="mailto:[e-mail]?subject=学习总结"> 主题

<a href="mailto:[e-mail]?body=xxxx">      内容

发邮件

<1>网页链接

<!--href:跳转的页面路径    target:新页面打开显示位置-->

<!--网页链接1：外部页面跳转-->

<ahref="http://www.baidu.com"target="_self">百度</a>

<!--网页链接2：本地页面之间的相互跳转-->

<ahref="Demo02.html"target="_blank">Demo02</a>

<2>锚点链接

<!--name:给页面添加一个锚点-->

<aname="top"></a>

<divstyle="height:1000px;background-color:chartreuse"></div>

<!--#+锚点名称-->

<ahref="#top">返回顶部</a>

<3>功能性链接

<ahref="mailto://[e-mail]?cc=[e-mail]">给郭老师发邮件</a>

<ahref="tencent://message/?uin=1015197771&Site=admin5.com&Menu=yes">给陈老师发邮件</a>