1初识Html

2019-03-18  本文已影响0人  行之北斗
    <h1>h1</h1>
    <h2>h2</h2>
    <h3>h3</h3>
    <h4>h4</h4>
    <h5>h5</h5>
    <h6>h6</h6>
    <p>自动换行</p>
    <p>千里不留行</p>
    <p>自动换行</p>
    
    决定是否看见了即进入改立刻就感觉热狗机<br />换行
    加密狗垃圾而根据二结构二<br /> 过会儿就感觉

<hr />水平线
<strong>加粗</strong>
<em>斜体</em>

src-文件路径
title-悬停提示
alt:如果无法显示图像,浏览器将显示替代文本
width:宽度
height:高度

<img src="0.jpg" alt="水果" title="请购买" width="300px" height="400px"/>

a href 超链接
Target属性有四个值,指定在哪打开链接
_parent 父窗口打开
_self 在当前页
_blank 新开页
_top 在顶级窗口,用于框架页

<a href="https://www.baidu.com" target="_self">百度</a>
        <a href="https://www.jd.com" target="_blank">京东</a>

无序列表ul

    <ul>
        <li>无序列表1</li>
        <li>无序列表2</li>
        <li>无序列表3</li>
    </ul>

有序列表ol

<ol>
    <li>有序列表1</li>
    <li>有序列表2</li>
    <li>有序列表3</li>
</ol>

自定义列表<dl></dl>
标题<dt></dt>
内容dd

    <dl>
        <dt>HTML</dt>
        <dd>制作网页</dd>
        <dt>111</dt>
        <dd>321</dd>
    </dl>

table表格
tr行
td列
th表头 加粗、居中
border 边框
cellspacing外边距
cellpadding内边距

    <table width="400px" border="1px" cellspacing="0px" cellpadding="0px">
        <tr>
            <th>1</th>
            <th>2</th>
            <th>3</th>
        </tr>
        <tr>
            <td>4</td>
            <td>5</td>
            <td>6</td>
        </tr>
        <tr><td>7</td>
            <td>8</td>
            <td>9</td>
        </tr>
    </table>

列合并
colspan 列合并、往右合并、 后面的数字表示合并几列

    <tr>
                
                <td>7</td>
                <td colspan="2">8</td>
                
            </tr>

行合并 rowspan、往下合并

<tr>
            <td rowspan="2">4</td>
            <td>5</td>
            <td>6</td>
        </tr>

caption表标题 thead表头,tbody表格体,tfoot 表格脚
代码可以不按顺序放,但是显示的效果一定是head-body-foot顺序

<table border="1px" cellpadding="0px" cellspacing="0px">
        <tfoot>
            
        
        <tr>
            <td>1111</td>
            <td>1111</td>
            <td>1111</td>
            <td>1111</td>
            <td>1111</td>
        </tr>
        </tfoot>
        <tbody>
            
        
        <tr>
            <td>2222</td>
            <td colspan="3" rowspan="2" >2222</td>
            
            <td>2222</td>
        </tr>
        
        <tr>
            <td>3333</td>
            
            
            <td>33333333</td>
        </tr>
        </tbody>
        <thead>
        <tr>
            <td>444444444</td>
            <td>444444444</td>
            <td>44444444444444</td>
            <td>444444444444</td>
            <td>444444444444444</td>
        </tr>
        </thead>
    </table>
上一篇 下一篇

猜你喜欢

热点阅读