博客列表 >day2作业

day2作业

移动用户-4050479
移动用户-4050479原创
2022年10月16日 11:47:45488浏览

html结构

  1. 头部 head
  2. 内容 body
  3. 标签和属性
  4. <!DOCTYPE html>
  5. <html lang="en">
  6. <head>
  7. <meta charset="UTF-8">
  8. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  9. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  10. <title>Document</title>
  11. </head>
  12. <body>
  13. <p id='' class=''>内容</p>
  14. </body>
  15. </html>

标签:分为自定义和预定义

标签作用描述内容类型
<p>内容</p>

属性:描述内容特征

  1. 预定义:如 id class
  2. 自定义:如 data-admin="admin"
    自定义标签需要加上前缀 data-
    <p class="css">内容</p>

元素

元素等于标签加属性


文档

文本中任何内容都需要 标签 引入,css,`js,php
DOM模型

  1. <imput type="text" size="10" value ="" required></imput>
  • required :布尔值 写required表示必须键入值,不写相反

页面加载顺序

自上而下
从左往右


HTML页面三宝

页面元素
css
javaScript


行内元素和块元素

  • 行内元素不会独占一行,水平排列自动换行 如 a span input
  • 块元素独占一行,垂直排列 如 p div

语法糖

  • {内容}
  • [属性]
    例如:[id=admin]{内容}
    默认生成的是div
  • class可以写成 .class{nav}
  • id可以写成 #id{nav}
  • 重复生成 *n 表示
    1. 例如:
    2. #id{nav}*6
  • 父子管理用 >表示
    1. 例如:
    2. ul>li{text}*10
  • 兄弟关系 + 表示
    1. 例如:
    2. h1{cv}+p{vb}
  • 父级 ^ 表示
    1. 例如
    2. .bix>span{cv}^p{12}
  • 分组 () 表示
    1. nav>h3{导航}+(ul>li*3>a{cv})
  • 序号 $ $@
    1. ul>li{cv-$}*3
    2. 顺序生成 1-3
    1. ul>li{cv-$@6}*3
    2. 顺序生成 6-8
    1. ul>li{cv-$@-1}*3
    2. 倒序生成 1-3
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议