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

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类型。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,684评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,143评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,214评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,788评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,796评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,665评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,027评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,679评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 41,346评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,664评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,766评论 1 331
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,412评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,015评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,974评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,203评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,073评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,501评论 2 343

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,727评论 1 92
  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 3,224评论 1 41
  • 本课来自http://www.imooc.com/learn/9请不要用作商业用途。 HTML5 HTML介绍 H...
    PYLON阅读 3,197评论 0 5
  • img标签: img标签中的img其实是英文image的缩写,所以img标签的作用, 就是告诉浏览器我们需要显示一...
    佩佩216阅读 1,466评论 0 2
  • Bootstrap是什么? 一套易用、优雅、灵活、可扩展的前端工具集--BootStrap。GitHub上介绍 的...
    凛0_0阅读 10,847评论 3 184