HTML-标签B、C、D

 

 

<!DOCTYPE html>
<html lang="en">

<head>
    <base href="http://www.w3school.com.cn/i/" />
    <base target="_blank" />
    <meta charset="UTF-8">
    <title>HTML5基础-格式标签A</title>
</head>

<body>
    <table border="5" width="100%">
        <caption>caption标签给表格加名称</caption>
         <tr><th bgcolor="#00FF00">base标签</th> </tr>
        <tr><th><img src = "eg_smile.gif" /> 
                <p><b> 注释:</b> base 标签位于head 元素内部,为页面上的所有链接规定默认地址或默认目标。
                 target属性有:_blank,_self,_parent,_top,framename,规定在何处打开页面上的所有链接
                </p>
        </th></tr>
           <tr><th bgcolor="#00FF00">bdi标签</th> </tr>
            <tr><th><ul>
                    <li>Username <bdi>Bill</bdi>:80 points </li>
                    <li>Username <bdi>Steve</bdi>:78 points </li>    
                    </ul>
                    <p><b>注释:</b> 标签允许您设置一段文本,使其脱离其父元素的文本方向设置。
                          在发布用户评论或其他您无法完全控制的内容时,该标签很有用。他是HTML5中的新标签。
                          属性dir:ltr,rtl,auto 规定 bdi元素内的文本的文本方向,默认是auto<br>
                          Firefox 和 Chrome 支持 bdi 标签
                     </p>
            </th> </tr>
            <tr> <th bgcolor="#00FF00"> bdo标签 </th></tr>
            <tr>
                <th>  
                    <bdo dir="rtl">Here is some Hebrew text</bdo>
                    <p><b>注释:</b> bdo 元素可覆盖默认的文本方向。如果您的浏览器支持 bi-directional override (bdo),上一行会从右向左输出 (rtl)</p>
                </th>
            </tr>
            <tr><th bgcolor="#00FF00"> <b>blockquote标签  </b> </th></tr>
            <tr><th>

                    <p>Here comes a long quotation:</p>
                   <blockquote>
                      This is a long quotation. 
                      This is a long quotation.
                      This is a long quotation. 
                  </blockquote>
                  <p>请注意,浏览器在 blockquote 元素前后添加了换行,并增加了外边距。</p>

              <p><b>注释:</b> 该标签标签定义块引用。标签内所有文本都会从常规文本中分离出来、经常会在左、
                          右两边进行缩进(增加外边距),而且有时会使用斜体。也就是说,块引用拥有它们自己的空间。
              </p>

                </th>
            </tr>
            <th bgcolor="#00FF00"><b>canvas标签</b> </th>
            <tr>
                <th>
                     <canvas id="myCanvas">does  your browser  support the canvas tag ?</canvas>
                   <script type="text/javascript">
                   var canvas= document.getElementById("myCanvas");
                   var ctx= canvas.getContext('2d');
                   ctx.fillStyle='#FF0034';
                   ctx.fillRect(0,0,80,100);
                   </script>
                    <p><b>注释:</b> 该标签定义图形,比如图表和其他图像。 但他只是图形容器,您必须使用脚本来绘制图形。
                    </p>
                </th>
            </tr>
            <tr>
                <th bgcolor="#00FF00"><b>datalist标签</b></th>
            </tr>
            <tr>
                <th>
                    <input list="cars" />
                    <datalist id="cars">
	                    <option value="BMW">
	                    <option value="Ford">
                    	<option value="Volvo">
                    </datalist>
                    <p><b>注释:</b>标签定义选项列表。
                       datalist 及其选项不会被显示出来,它仅仅是合法的输入值列表。
                       需使用 input 元素的 list 属性来绑定 datalist。 </p>
                </th>
            </tr>
            <tr>
                <th bgcolor="#00FF00"><b>dl,dt,dd标签</b></th>
            </tr>
            <tr>
                <th>
                  <dl>
                      <dt>计算机</dt>
                      <dd>用来计算的仪器 ... ...</dd>
                      <dt>显示器</dt>
                      <dd>以视觉方式显示信息的装置 ... ...</dd>
                 </dl>
                    <p><b>注释:</b>  在定义列表中定义条目的定义部分。</p>
                </th>
            </tr>
             <tr>
                <th bgcolor="#00FF00"><b>del,ins标签</b></th>
            </tr>
            <tr>
                <th>
                  <p>一打有 <del>二十</del> <ins>十二</ins> 件。</p>
                  <p>大多数浏览器会改写为删除文本和下划线文本。</p>
                  <p>一些老式的浏览器会把删除文本和下划线文本显示为普通文本。</p>
                    <p><b>注释:</b>  定义文档中已被删除的文本。del 与 ins 标签配合使用,来描述文档中的更新和修正</p>
                </th>
            </tr>
                    <tr>
                <th bgcolor="#00FF00"><b>details标签</b></th>
            </tr>
            <tr>
                <th>                
                   <details>
                      <summary>Copyright 2011.</summary>
                       <p>All pages and graphics on this web site are the property of W3School.</p>
                  </details>
                  <p><b>注释:</b>  用于描述文档或文档某个部分的细节,他是 HTML 5 中的新标签,目前只有 Chrome 支持 </p>
                </th>
            </tr>
    </table>
</body>

</html>

猜你喜欢

转载自blog.csdn.net/qq_37503890/article/details/88095936
今日推荐