HTML回顾

<html>
    <title>标题标签就是网页的名字,要放在body的外面</title>
    <body bgcolor="d3e19b"><!--背景颜色-->
        <h1 align="center">这是风景旧曾谙_MT的一个文档,这个标签是一级标签</h1>  
        <h2 align="center">这个标签是二级标签,其他标签就不展示了</h2>  
            <!--align="center" 对齐方式:居中。<hn 属性名="属性值">n表示1-6</hn>-->
        <p align="center">我把标题在页面中进行了居中排列,同时段落内容也进行了居中排列。<a href="https://blog.csdn.net/qq_38968170" >点击查看我的CSDN&nbsp>></a>&nbsp;风景旧曾谙_MT&copy;版权所有
        </p>
            <!--&nbsp;代表一个空格。&copy;代表&copy;版权所有-->
<br/>
        <p align="center">这是一对尖括号,&lt;&nbsp;&gt;</p>
<br/>
        <p align="center"><b>这是粗体字</b></p>
<br/>
        <p align="center"><i>这是斜体字</i></p>
<br/>
        <p align="center"><s>这是删除线</s></p>
<br/>
        <p align="center"><u>这是下划线</u></p>
<br/>
        <p align="center"><b><i><s><u>这是一个多样式文本。段落文本不能直接添加颜色属性,需要用到font标签进行嵌套</u></s></i></b></p>
<br/>
        <p align="center"><font color="red">sup和sub怎么用?</font></p>
        <p align="center"><font face="华文行楷" size="6px" color="blue">这是一个font标签,规定文本的字体、字体尺寸、字体颜色等</font></p>
<br/>
        <p align="center">水平线是什么?——往下看:</p>
        <hr size="2" color="#d11812" width="100%"/>
        <p align="center">看到了吧,可以修改水平线的长度大小、宽度、颜色等。</p>
        <hr size="5" color="#df7c0d" width="60%"/>
<br/>
    <p align="center">下面介绍一个单标签img,先看效果:<br/><imgsrc="http://img.51miz.com/Element/00/98/37/04/bcb14cb0_E983704_e72a2525.jpg!/quality/90/unsharp/true/compress/true/format/jpg/fh/630" alt="Big boat" width="470" Hight=280" >               </p>
<br/>
    <p align="center">也可以看看这个链接,了解更多图像标签的内容。<ahref="http://www.w3school.com.cn/html/html_images.asp" >点击查看>></a></p>
<br/>
        <pre align="center">听 说 这 是 一 个 文 本 预 格 式 标 签 ,
可 以 保 留 标 签 中 的 所 有 空 格 和 换 行 。</pre>
<br/>
    <p align="center">超链接</p>
    <p align="center"><a href="https://blog.csdn.net/qq_38968170">就是上面的点击查看我的CSDN >></a>&nbsp和&nbsp<a href="http://www.w3school.com.cn/html/html_images.asp">了解更多图像标签内容>></a></p>
<br/>
    <p align="center">列表和解释</p>
    <ul>
        <li>这是无序列表1 ul是无序列表</li>
        <li>这是无序列表2 ul标签里面只能放li,li里面就可以随便放。</li>
        <li>这是无序列表3 li标签不要单独使用,它的父元素一定是ul/ol。</li>
    </ul>
    <ol>
        <li>这是有序列表1 ol是有序列表</li>
        <li>这是有序列表2</li>
        <li>这是有序列表3</li>
    </ol>
    <dl>
        <dt>这是名词解释</dt>
        <dd>dl、dt、dd都属于块级元素</dd>
        <dt>这是dt</dt>
        <dd>这是dd</dd>
        <dt>你发现区别了吗?</dt>
    </dl>
        <p align="center">下面来看图片滚动</p>
    <marquee bgcolor="d3e19b" direction="right" behavior="" loop="-1">
        <img src="http://pic40.nipic.com/20140428/9413594_233824304000_2.jpg" width="600" height="300">
        <img src="http://pic117.nipic.com/file/20161209/2869171_180153386000_2.jpg" width="600" height="300">
        <img src="http://img.redocn.com/sheji/20160126/guohuameihuashanshuijiangshanruhuafugufengdianshibeijingqiang_5794954.jpg" width="600" height="300">
        <img src="http://pic9.nipic.com/20100821/2572038_145220792333_2.jpg" width="600" height="300">
    </marquee>
        <p align="center">bgcolor="设置背景颜色" direction="设置滚动方向" behavior="设置滚动样式" loop="设置滚动次数,负数代表无限循环,正数代表几次。"基本不用,一般用js实现。</p>
        <p align="center">下面来看<a href="http://www.w3school.com.cn/html/html_tables.asp" >表格</a>:一个tr代表一行,一个td代表一行中有多少个单元格</p>
                <table bgcolor="white" border="1px" width="400px" height="100"align="center">
    <tr>
        <th>文字</th>
        <th>文字</th>
        <th>文字</th>
        <th>文字</th>
        <th>文字</th>
        <th>这是th</th>
    </tr>
    <tr>
        <td>文字</td>
        <td>文字</td>
        <td>文字</td>
        <td>文字</td>
        <td>文字</td>
        <td>这是td</td>
    </tr>
    <tr align="center">
        <td>文字</td>
        <td>文字</td>
        <td>文字</td>
        <td>文字</td>
        <td>文字</td>
        <td>这是td设置居中后</td>
    </tr>
    <p align="center">table:表示一个表格声明;tr:表示表格的一行;td:表示一个单元格;th:主要是添加标体行的单元格,实际作用就是将内部文字居中且加粗。bgcolor:背景色;border:边框像素1px(默认表格是没有边框的);cellspacing:表示单元格格与格之间的间距……</p>
    </body>
</html>

猜你喜欢

转载自blog.csdn.net/qq_38968170/article/details/86536015