美文网首页
html样式，链接，表格，表单

html样式，链接，表格，表单

作者: 李霖神谷 | 来源:发表于2017-09-23 14:00 被阅读263次

1，HTML样式：
样式是 HTML 4 引入的，通过 HTML 样式，能够通过使用 style 属性直接将样式添加到 HTML 元素，或者间接地在独立的样式表中（CSS 文件）进行定义。
HTML样式：


<!--html样式-->
<html>
    <!--背景颜色-->
    <body style="background-color:#33324e">
    <!--字体背景颜色-->
    <h style="background-color:#436DBC">this is hapo</h>
    <br/>
    <!--字体，颜色，大小-->
    <h style="background-color:#436DBC;font-size:80px;font-family:verdana;">this is hapo</h>
    <!--文本对齐-->
    <br/>
    <h1 style="text-align:center;font-size:100px;">this is title</h1>
        </body>
    </html>

在标签里使用style来修饰文本，background-color：背景颜色，font-size：字大小，font-family：字体类型。text-align：文本对齐（文字居中）。
2，html链接：
HTML通过<a>（锚）标签来创建与另一个文件连接的链接，锚可以链接网路上任意一个资源，如一个网页，音频，图片等。

使用标签来访问网络上的资源：
<html>
    <body>
        <a href="http://www.w3school.com.cn/"target="_blank">visit w3c</a>
        <br/>
        <a href="#lishuai">lishuai is handesom</a>
        
        <h><a name="lishaui">what lishuai is he</a></h>
        </body>
    
    </html>

在target标签中写上——blank，就会在新窗口中打开一个页面。name中赋值名字，在href中写上#加名字就会直接跳转到当前页面name所在标签下。
3，html表格：

<html>
    <body>
        <table border="8"frame="hsides">
            <caption>家族谱</caption>
            <tr>
                <th>HEAD lishaui</th>
                <th colspan="2">HEAD LALAL</th>
                </tr>
            <tr>
                <td>llalalal</td>
                <td>dadada</td>
                <td>hahhaha</td>
                </tr>
            <tr>
                <td>lishaui</td>
                <td>&nbsp</td>
                <td>&nbsp</td>
                </tr>
            </table>
            <table border="5"cellpadding="20"cellspacing="10"bgcolor="red">
                <tr>
                    <td align="left">hehehehhe</td>
                    <td align="left">lallala</td>
                    </tr>
                    <tr>
                <td>lishaui</td>
                <td>&nbsp</td>
                <td>&nbs</td>
                </table>
        </body>
    
    </html>

table是定义表格的标签，border表格边框粗细，tr代表表格中的行，td代表行里的单元格标签，td中可以写文本、图片、列表、段落、表单、水平线、表格等等。th标签定义头标题。如果想定义一个带有边框的单元格就在td标签中写上&nbsp。caption为表格定义名字，colspan横跨单元格。cellpadding定义了表格的尺寸。cellspacing定义单元格之间的距离。bdcolor定义背景颜色，align使得标签中的元素排列整齐，可以向左向右看齐，frame是控制边框的。
4,html表单：

<html>
    <body>
        <form>
            <!--当用户键入字母数字时就需要text类型-->
            用户：
            <input type="text" name="firstname"/>
            <br/>
            密码：
            <input type="text" name="lastname"></input>
            </form>
            <form>
                <!--当用户从多个选项中选择一个时需要单使用单选按钮-->
                
                <input type="radio" name="sex" value="male">李帅
                <br/>
        
                <input type="radio" name="sex" value="fale">帅丽莎ui
                </form>
                <form>
                    <!--当用户需要选择一个或多个选项时，就需要使用复选框-->
                    <input type="checkbox" name="bey"/>
                    i have a bike
                    <input type="checkbox" name="be"/>
                    i have a tex
                    <input type="checkbox" name="b"/>
                    i have a underground
                    </form>
                    <form name="input" action="lishuai.html">
                        <!--带有动作属性的表单-->
                        你要输入的内容：
                        <input type="text" name="user"/>
                        <input type="submit" value="Submit"/>
                        </form>
                        <form>
                            <!--定义一个简单的下拉列表-->
                            <select>
                                <option value="vovola">vovola</option>
                                <option value="sulaca">sulaca</option>
                                <option value="malsila">malsila</option>
                                </select>
                            </form>
                            <form>
                                <!--创建一个按钮-->
                                <input type="button"value="hello world"/>
                                </form>
                            <br/>
                            <textarea rows="10" cols="30">
                                the text is very big butiful
        </body>
    </html>

表单是一个包含表单元素的区域。表单元素是允许用户在表单中（比如：文本域、下拉列表、单选框、复选框等等）输入信息的元素。form定义表单的标签。表单下最常用的标签是input标签，根据用户不同的需求定义type类型。

相关文章