html与css基础

HTML标签:表单标签

* 表单:
    * 概念: 用户采集用户输入的数据.用于和服务器交互的.
    * from: 用于定义表单的.
        * 属性: 
            * action: 指定提交数据的url
            * method: 指定提交方式
                  * get,post的区别: 
                       1. 请求参数是否在地址栏显示,一个封装在请求行中,一个封装在请求体中.
                       2. 请求参数大小有无限制.
                       3. 是否安全
        * 其中注意表单项中的数据要想被提交：必须指定其name属性

    * 表单项标签: 
      * input: 可以type属性,改变元素的样式
        * type属性:
            * text: 文本输入框
                  * placeholder:指定输入框的提示信息.
            * password: 密码输入框
            * radio: 单选框
                  * 注意:
                        1. 如果多个单选框实现单选,则多个单选框的name值必须一致
                        2. 一般会为每一个单选框提供value属性
                        3. checked属性
            * checkbox: 复选框
                  * 注意: 
                        1. 一般会为每一个单选框提供value属性
                        2. checked属性
            * file: 文件选择框
            * hidden: 隐藏域,用于提交一些基本信息
            * 按钮:
                  * submit: 提交按钮
                  * button: 普通按钮
                  * image: 图片按钮
      * label: 输入项的文字描述信息
        * 注意:
          * label的for属性一般会与input的id属性值对应.单机label区域,input会获取焦点
      * select: 下拉列表
        * 子元素: option
      * textarea: 文本域
        * cols:指定列数
        * rows:指定行数

CSS：页面美化和布局控制

* 概念： Cascading Style Sheets 层叠样式表
        * 层叠：多个样式可以作用在同一个html的元素上，同时生效
* 好处：
    * 功能强大
        * 将内容展示和样式控制分离
	   * 降低耦合度。解耦
	   * 让分工协作更容易
	   * 提高开发效率
* CSS的使用：CSS与html结合方式
        * 内联样式
          <div style="color:red;">
        * 内部样式
          <style>
          div {
          color:blue;
          }
        * 外部样式
          <link rel="stylesheet" href="css/a.css"> 或 <style>@import "css/a.css"</style>
* css语法：
	* 格式：
		选择器 {
			属性名1:属性值1;
			属性名2:属性值2;
			...
		}
	* 选择器:筛选具有相似特征的元素
	* 注意：
		* 每一对属性需要使用；隔开，最后一对属性可以不加；
    * 选择器
      * 基础选择器
         id选择器,元素选择器,类选择器
      * 扩展选择器
          *选择器,并集选择器(选择1,选择2),子选择器(选择器1 选择器2),父选择器(选择器1>选择器2)
           属性选择器(元素名称[属性名='属性值']),伪类选择器(元素:状态{})
          * 其中<a>的状态:link(初始化),visited(被访问过),active(正在访问),hover(鼠标悬浮)

    * 属性
      * 字体
          font-size,color,text-align,line-height
      * 背景
          background
      * 边框
          border
      * 尺寸
          width,height
      * 盒子模型
          margin 外边距  
          padding 内边距
          因为padding会影响整个盒子的大小所以box-sizing 固定 
          float 浮动