• HTML练习题


    1、查询一下对div和span标签的理解

    div标签:是用来为HTML文档内大块的内容提供结构和背景的元素。DIV的起始标签和结束标签之间的所有内容都是用来构成这个块的,中文我们把它称作“层”。 
    span标签:是被用来组合文档中的行内元素。span没有固定的格式表现, 当对它应用样式时,它才会产生视觉上的变化。

    2、如何理解标签的嵌套结构?它们的规则是怎样的?

    块元素可以包含内联元素或某些块元素,但内联元素却不能包含块元素,它只能包含其它的内联元素

    如:

    <div><div></div><h1></h1><p><p></div> ✔️

    <a href=”#”><span></span></a> ✔️

    <span><div></div></span> ❌

    块级元素不能放在p标签里面,比如

    <p><ol><li></li></ol></p> ❌

    <p><div></div></p> ❌

    有几个特殊的块级元素只能包含内嵌元素,不能再包含块级元素,这几个特殊的标签是:

    h1、h2、h3、h4、h5、h6、p
    
    1. li元素可以嵌入ul,ol,div等标签

    3、如果给你一个网站,让你只用div来画块的画,如何画?比如京东

    可以分为logo,导航,主体,页脚。然后依次用div 去划分,调节大小,背景等属性。

    4、一个html文件包含几部分?

    一个HTML文件是有自己固定结构的。

    <!DOCTYPE HTML>
    <html>
        <head>...</head>
        <body>...</body>
    </html>

    让我们来解释一下上面的代码:

    首先,<!DOCTYPE HTML>是文档声明,必须写在HTML文档的第一行,位于<html>标签之前,表明该文档是HTML5文档。

    1. <html></html> 称为根标签,所有的网页标签都在<html></html>中。
    2. <head></head> 标签用于定义文档的头部,它是所有头部元素的容器。常见的头部元素有<title><script><style><link><meta>等标签,头部标签在下一节中会有详细介绍。
    3. <body></body>标签之间的内容是网页的主要内容,如<h1><p><a><img>等网页内容标签,在<body>标签中的内容(图中淡绿色部分内容)最终会在浏览器中显示出来。

    HTML文档包含了HTML标签及文本内容,不同的标签在浏览器上会显示出不同的效果,所以我们需要记住最常见的标签的特性

    5、当使用p标签的使用,应该注意什么?

    p标签是块级元素,要注意的是他里面不嵌套块级元素,只能包含内嵌元素。

    6、阐述一下form标签的作用?form标签的属性有哪些?

    通俗的讲 form标签是用来进行表单提交用的
    form标签里面的常见属性如下
    action: 表单提交的地址, 肯定是要提交给某个服务器的,action的地址就是要提交的服务器的地址
    method:以何种方式提交,常见的为get和post. 区别在于一个是明文(在url中显示),一个是暗文

    form标签是和服务器交互用的, 以用户注册为例
    用户在浏览器中的注册页面添加信息后,点击提交,此时是将这些信息提交至某个服务器
    服务器根据提交的信息将注册信息保存. 这个过程就需要使用form标签了
    form中action属性应该是服务器注册模块的地址
    form标签下应该有input,textarea,select等表单标签以及<input type=" submit"标签
    当点击submit按钮时,浏览器会自动将表单信息封装提交至action中的地址
    所谓的提交就是访问action中地址并携带着form表单中input,textarea,select的信息

    7、ul的孩子元素一定是li么?

    不一定,ul是无序列表,块级元素,它可以包含,其它块级元素以及内嵌元素。

    8、如何理解语义化的标签?

    语义化的主要目的在于,直观的认识标签(markup)和属性(attribute)的用途和作用。可以概括为:用正确的标签做正确的事情。 
    html语义化可以让页面的内容结构化,便于浏览器解析,便于搜索引擎解析,并提高代码的可维护度和可重用性。 
    比如,尽可能少的使用无语义的标签div,使用结构化标签<header>、<section>、<footer>。

    9、标签的分类

    常用的块状元素:

    <div> <p> <h1>~<h6> <ol> <ul> <table><form> <li>
    

    常用的行内元素

    <a> <span> <br> <i> <em> <strong> <label>
    

    常用的行内块状元素:

    <img> <input>
    

    块级元素特点:display:block;

    1、每个块级元素都从新的一行开始,并且其后的元素也另起一行。独占一行

    2、元素的高度、宽度、行高以及顶和底边距都可设置。

    3、元素宽度在不设置的情况下,是它本身父容器的100%(和父元素的宽度一致),除非设定一个宽度。

    行内元素特点:display:inline;

    1、和其他元素都在一行上;

    2、元素的高度、宽度及顶部和底部边距不可设置;

    3、元素的宽度就是它包含的文字或图片的宽度,不可改变。

    行内块状元素的特点:display:inline-block;

    1、和其他元素都在一行上;

    2、元素的高度、宽度、行高以及顶和底边距都可设置

    注意

    我们可以通过display属性对块级元素、行内元素、行内块元素进行转换,为后面页面布局做好了准备。


  • 相关阅读:
    MVC三层架构
    JavaScript,你好!(二)
    HTML你好!
    Typora,你好!
    安装mysqlmysql-5.7.24-linux-glibc2.12-x86_64
    sizeof与strlen的区别
    printf格式化输出
    java泛型讲解
    双系统删除Linux系统
    kali破解wifi密码
  • 原文地址:https://www.cnblogs.com/anzhangjun/p/9596029.html
Copyright © 2020-2023  润新知