• 零基础html学习/刷题-第一期


    之前写的html学习的文章都是零零散散的,这次出个整合的专栏,把内容集中起来,做个知识复盘,顺带刷刷题。牛客网非常值得一用,刷题也很好刷!对于基础入门最合适不过。

    博主主页:WDm-xmax 原id:GUIDM

    收入专栏:零基础html学习/刷题

    刷题网站:牛客网

    目录

    学习

    一、html简介

    二、结构

    三、标题和段落标签

    刷题(第一期)


    学习


    一、html简介

    html(超文本标记语言),标准通用标记语言下的一个应用。 “超文本”就是指页面内可以包含图片链接,甚至音乐程序等非文字元素。

    二、结构

    头部:中的内容, 内的元素可包含脚本,指示浏览器在何处可以找到样式表,提供元信息,等等。

    可以添加到 head 部分:、<base>、<link>、<meta>、<script> 以及 <style>。</p> </blockquote> <p> 主体:<body></body>中的内容。</p> <p><html></html>中包含了整个页面的所有内容,称为根元素。</p> <p><img alt="" height="244" src="https://1000bd.com/contentImg/2022/08/18/063447577.png" ></p> <p>上图则为 html代码的一个基本格式。</p> <blockquote> <p>vscode中输入一个叹号就能实现。</p> </blockquote> <p><img alt="" height="101" src="https://1000bd.com/contentImg/2022/08/18/063447766.png" ></p> <blockquote> <p><meta charset="UTF-8">:该文档使用的字符集,设置为UTF-8</p> <p><meta http-equiv="X-UA-Compatible" content="IE=edge">:针对IE8新加的一个设置,对于IE8之外的浏览器是不识别的。</p> <p><title>Document:设置了页面的标题

    三、标题和段落标签

    标题


    标签

    ~

    1. <h1>这是1级别的标题h1>
    2. <h2>这是2级别的标题h2>
    3. <h3>这是3级别的标题h3>
    4. <h4>这是4级别的标题h4>
    5. <h5>这是5级别的标题h5>
    6. <h6>这是6级别的标题h6>

     效果如下:

    插播一条小技巧 :

    创建多个不同标题标签

    标签名${标题$文本内容}*标签重复次数

    就如上面的,可以用

    h${这是$级别的标题}*6

    属性

    属性说明
    alignleft靠左对齐
    right靠右对齐
    center

    居中对齐 

     

     

     

     段落

    标签


    1. <p>天若无道,就该遵循天命p>
    2. <p>天若有道……p>

    效果如下:

     属性

    属性说明
    alignleft靠左对齐
    right靠右对齐
    center

    居中对齐 

     

     

     

     

     



    刷题(第一期)


    第一题:

    解题:导航标签为

    标签定义文档的页眉(介绍信息)

    1. <header>
    2. <nav>nav>
    3. header>

    第二题:

     解题:输入框为input标签

    使用type属性的password值为密码,checkbox为复选框。

    默认值使用value属性,已勾选状态使用checked属性。

    1. <form>
    2. <input type='password' value='nowcoder'/>
    3. <input type='checkbox' checked/>
    4. form>

    第三题:

    解题:表格结构为

           

               

           

    表格标题:

    1. <table>
    2. <caption>nowcodercaption>
    3. <tr>
    4. <td>td>
    5. <td>td>
    6. <td>td>
    7. tr>
    8. <tr>
    9. <td>td>
    10. <td>td>
    11. <td>td>
    12. tr>
    13. table>

     第四题:

    解题:新窗口打开文档,用a标签的target属性的_blank 值。

     <a href="#" target="_blank">a>

    第五题:

    解题:自定义列表格式

     

       

     

    1. <dl>
    2. <dt>nowcoderdt>
    3. <dd>nowcoderdd>
    4. dl>

  • 相关阅读:
    判断2叉树是否为对称树(C#)
    磁盘性能测试
    LetCode之热题100.1——哈希(两数之和)
    历时数月钻研推流/对比各种流媒体服务程序/PK总结
    【Linux】守护进程
    Web前端:JavaScript的未来——发展趋势和预测
    Reactor模型深度解析
    六、K8S之StatefulSet
    OpenSSL ca证书命令操作详解
    Hadoop2.8 安装心得
  • 原文地址:https://blog.csdn.net/m0_61901625/article/details/126354604