HTML

概念

  • HTML(HyperText Markup Language),即超文本标记语言(不区分大小写)
  • 文档结构
  • image.png

常用标记

  • 换行标记
  • 段落标记

  • 标题标记

  • 超链接标记

    1. 其中herf"xxx.jsp?para1=xxx&&para2=xxx"可以传参 request.getParameter("paraname")来获取 form中的action属性同理
  • 图片标记HTML与CSS - 图2

  • 居中标记
  • 有序列表
      (两个基本属性 type设置属性/start)
            - ![image.png](https://cdn.nlark.com/yuque/0/2021/png/12910816/1638181078313-69f946e3-50f8-4748-aac4-80661a29428d.png#clientId=u6b862667-6288-4&from=paste&height=142&id=u36b4b936&margin=%5Bobject%20Object%5D&name=image.png&originHeight=284&originWidth=579&originalType=binary&ratio=1&size=26499&status=done&style=none&taskId=udf11824c-fe82-4172-a5c7-20805f4d6a5&width=289.5)
      
      • 无序列表
        • 列表项
        • 自定义列表
          列表项标记
          定义用

      image.pngimage.png

      • 下拉列表框 表单输入的类型是由type属性决定

      type属性内容如下
      image.pngimage.png

      CSS

      CSS样式表(层叠样式表)

      选择符{属性:属性值; 属性:属性值; … }

      标记选择器
      a{ 
          xxxxx
      }
      
      类别选择器  用class属性表示
      .classname{
          xxxxx
      }
      
      id选择器 用#显示
      #idname{
          xxxxx
      }
      

      选择器的嵌套

      p{ }: 为所有 p 元素指定一个样式
      .marked{ }: 为所有 class=”marked” 的元素指定一个样式
      .marked p{ }: 为所有 class=”marked” 元素内的 p 元素指定一个样式
      p.marked{ }: 为所有 class=”marked” 的 p 元素指定一个样式
      p>a{}:为所有p内子元素为a的指定样式(不含孙子元素)
      div,span,ul>.dad { 并集选择器
      color: red;
      }

      插入方式

      • 行内样式(内联样式)

      直接定义在HTML标记内
      <p style="color:#F00; font-size:36px;">

      • 内嵌式(内部样式)