简单html

忘是亡心i 2022-03-10 18:50 264阅读 0赞

<title>myfirstpage<title/>
    </head>
    段落标签<p>xxxx</p>
    换行标签<br/>
    加粗<strong>xxxx</strong>
    主副标题<h1>xxxx</h1>
    空格  大于> 小于<引号"@符号  ©
    
    图片
    <img src="image/hetao.jpg" width="160" height="160"  
         alt="" title=""/>
    
    文字链接
    <a href="https://www.baidu.com" target="_self">百度</a><br/>........本页面直接跳转
    <a href="https://www.baidu.com" target="_blank">百度</a><br/>...重开一个页面再跳转
    
    弹出对话框
    <a href="javascript:alert('a')" >弹出对话框</a><br/>
    
    拨打电话
    <a href="tel:12350000000" >拨打电话</a><br/>
    
    图片链接
    <a  href="detail.html"  target="_blank">姑娘，欢迎降落在这残酷的世界</a>
    <a  href="detail.html"  target="_blank">
        <img src="image/img1.png" alt="姑娘，欢迎降落在这残酷的世界"
               title="姑娘，欢迎降落在这残酷的世界" />
    </a>  
    
    锚链接
     <img src="image/img1.png" alt="img1"
        /><br/><a name="f1"></a>................定义一个锚以确认锚的位置 <a href="#">潇洒走一回</a>
        <a href="#f1">F1</a><br/>................创建跳转连接   <a href="#"><img src="image/pic1.png" alt=""/></a>
        
    
    邮件链接
    <a href="mailto:wangyouliang@yahoo.cn">联系我们</a>
    
    元素分块
     <p>我是p元素</p>
        <h1>我是标题h1</h1>
        <h6>我是标题h6</h6>
        <a href="#">我是超链接a元素</a>
        <strong>我是strong元素</strong>
        <em>我是em元素</em>
    
    无序列表
        <ul>
          <li>范冰冰演藏族女孩</li>
        </ul>
    有序列表
        <ol>
          <li>范冰冰演藏族女孩</li>  
        </ol>
    定义列表
        <dl>
          <dt>水果</dt>
        </dl>
    
    <table>
        <tr>
             <th>第1个单元格的标题</th>
             <th>第2个单元格的标题</th>
         </tr>
    </table>
    <table>
    <table>
        <tr>
             <td>第1个单元格的内容</td>
             <td>第2个单元格的内容</td>
         </tr>
    </table>
    <table>
          <tr>
             <td>第1个单元格的内容</td>
             <td>第2个单元格的内容</td>
             <td colspan="n">单元格内容</td>.......横的合并
             <td rowspan="2">张三</td>..............竖的合并
          </tr>
    </table>
    
    视频播放
    <video src="video/video.mp4" controls></video>........（浏览器一般不支持MP4格式）
    <video controls>
        <source src="video/video.webm" type="video/webm"/>
        <source src="video/video.mp4" type="video/mp4"/>
    </video>
    
    自动播放
    <video autoplay muted loop>(可能要加muted实现自动播放，loop实现循环播放）
        <source src="video/video.webm" type="video/webm"/>
        <source src="video/video.mp4" type="video/mp4"/>
        你的浏览器不支持video元素
    </video>
    
    音频播放
    <audio src="音频路径" controls></video>
    <audio controls>
        <source src="music/music.mp3" type="audio/mpeg"/>
        <source src="music/music.ogg" type="audio/ogg"/>
        你的浏览器不支持audio元素
    </audio>
    
    网页结构
    <header><h2>网页头部</h2> </header>
    <section><h2>网页主体部分</h2></section>
    <footer><h2>网页底部</h2></footer>
    <article><h2>独立的文章内容</h2></article>
    <aside><h2>相关内容或应用</h2></aside>
    <nav><h2>导航类辅助内容</h2></nav>
    
    frame框架
    <iframe src="path" name="mainFrame" ></iframe>
    
    实现页面间的相互跳转
    <iframe name="mainFrame" src="subframe/the_second.html"></iframe>
    
    在超链接上设置target目标窗口属性为希望显示的框架窗口名
    <a href="subframe/the_second.html "  target="mainFrame">下边显示第二页</a>
    <a href="http://www.baidu.com" target="mainFrame">点击打开百度</a>
    
    定义长宽
    <iframe name="mainFrame" width="800px" height="150px"  src="subframe/the_second.html"></iframe>
    
    同一页面标签实现不同网页
    <iframe name="f1"></iframe><br/>
    <a href="https://www.baidu.com" target="f1">百度</a> <a href="http://www.sohu.com" target="f1">搜狐</a><br/>