html+css知识点整理

一、html

　　1、锚链接

　　　　（1）用法：

　　　　　　从A页面的甲位置跳转到本页面中的已位置（同一页面）

　　　　　　从A页面的甲位置跳转到B页面中的乙位置（两个页面）

　　　　（2）创建步骤：

　　　　　　a. 创建跳转标记

　　　　　　　　乙位置　　

　　　　　　b.创建跳转链接

　　　　　　　　甲位置 

　　2、html列表

    <ul style="disc">
        <li>列表1li>
        <li>列表2li>
        <li>列表3li>
    ul>
    
    <ul style="square">
        <li>列表1li>
        <li>列表2li>
        <li>列表3li>
    ul>
    
    <ul style="circle">
        <li>列表1li>
        <li>列表2li>
        <li>列表3li>
    ul>

    
    <ul>
        <li>列表1
            <ul>
                <li>列表1li>
                <li>列表2li>
                <li>列表3li>
            ul>
        li>
        <li>列表2li>
        <li>列表3li>
    ul>

    
    <ol style="A">
        <li>列表1li>
        <li>列表2li>
        <li>列表3li>
    ol>
    <ol style="a">
        <li>列表1li>
        <li>列表2li>
        <li>列表3li>
    ol>
    <ol style="I">
        <li>列表1li>
        <li>列表2li>
        <li>列表3li>
    ol>

    
    <dl>
        <dt>水果dt>
        <dd>苹果dd>
        <dd>香蕉dd>
        <dd>橘子dd>
    dl>

　　3、表单

　　　　（1）关联表单元素

　　　　　　语法：

　　　　　　　　

　　　　　　栗子：

　　　　　　　　 姓名：

　　　　　　　　或

　　　　　　　　姓名：　　　　　　　　

　　　　　（2）只读属性

　　　　　　　　readonly: 希望某个框内的内容只允许用户看，不能修改

　　　　　（3）禁用属性

　　　　　　　　disabled:因没达到使用的条件，限制用户使用

　　　　　　 栗子：

　　　　　　　　

　　　　　　　　

 　　4、表格

　　　　（1）表格常用属性

　　　　　　width/height :表格的宽/高，单位可以为像素（px）或百分比（%）

　　　　　　border :默认为表格边框为0（无边框），可设置为数值

　　　　　　cellspacing :控制单元格之间的间距，可设置为数值

　　　　　　cellpadding :控制单元格边框和其内容的间距，可设置为数值

　　　　　　align :设置文本的水平对齐方式，可为left,center,right

　　　　　　valign :设置文本的竖直方向对齐方式，可为top,middle,bottom

　　　　　　bgcolor :设置背景色

　　　　　　

<table border="1" width="100%" cellspacing="0" cellpadding="0" bgcolor="red">
        <tr>
            <td align="center">第一个单元格td>
            <td>第二个单元格td>
        tr>
        <tr>
            <td align="center">第一个单元格td>
            <td>第二个单元格td>
        tr>
    table>

　　　　（2）表格高级标签

　　　　　　　　a、表格的分组标签

<table width="100%" cellpadding="0" cellspacing="0" border="1">
        <caption>年终数据报表caption>
        <thead bgcolor="#99ffff">
            <tr>
                <th>月份th>
                <th>收入th>
            tr>
        thead>
        <tbody bgcolor="#009966">
            <tr>
                <td>1月td>
                <td>100td>
            tr>
            <tr>
                <td>2月td>
                <td>100td>
            tr>
            <tr>
                <td>3月td>
                <td>100td>
            tr>
            <tr>
                <td>4月td>
                <td>100td>
            tr>
            <tr>
                <td>5月td>
                <td>100td>
            tr>
            <tr>
                <td>6月td>
                <td>100td>
            tr>
        tbody>
        <tfoot bgcolor="#ffff00">
            <tr>
                <td>平均月收入td>
                <td>196.67td>
            tr>
            <tr>
                <td>总计td>
                <td>1180td>
            tr>
        tfoot>

    table>

 　　　　　　　　b、表格的跨行与跨列

　　　　　　　　　　跨列：

　　　　　　　　　　　　标签的colspan 属性，值为数字，表示合并几列；

　　　　　　　　　　跨行：

　　　　　　　　　　　　标签的rowspan 属性，值为数字，表示合并几行；

 <table width="400" cellpadding="0" cellspacing="0" border="1">
        <tr>
            <th colspan="3">学生成绩th>
        tr>
        <tr>
            <td rowspan="2">张三td>
            <td>语文td>
            <td>98td>
        tr>
        <tr>
            <td>数学td>
            <td>95td>
        tr>
        <tr>
            <td rowspan="2">李四td>
            <td>语文td>
            <td>88td>
        tr>
        <tr>
            <td>数学td>
            <td>91td>
        tr>

    table>

 

　　5、XHTML框架结构

　　　　（1）