讲课010

a标签：点击方便的话，将a标签转成块，撑起容器，搞得好点击跳转。

做完看板块溢出不溢出 溢出改了它

表单（能用）

盒子和定位要记

只能看，不能输入：readonly                禁用在里面插入成点不了：disabled="disabled"

单写或+等号都可【disabled，readonly="readonly"】              （搞事的时候好玩）

单选框优化：本来点框有用，现在搞得点文字也有用

原先： <input type="radio" name="chi"  />男                <input type="radio" name="chi"  />女
现在： <input type="radio" name="sex" id="boy" value="" />        <label for="boy">男</label>
            <input type="radio" name="sex" id="girl" value="" />        <label for="girl">女</label>

复选框也可以这样搞。

下拉菜单：<form >        <select>        <option>        </option>         </select>         </form>     

表单分框框外加标题：                                                【还可以，好看】

<fieldset id="">   <legend></legend>        </fieldset>

列子： <fieldset id="">    <legend>【标题内容】</legend>        <form action="">

            <input type="text" name="" id="">            </form>          </fieldset>

省事打法，用<iframe src="【路径】" width="" height=""></iframe>，把另一个页面拉到自己网站上。

form属性值：<form action="【跳转地址】" method="【提交方法】" target="【开个新页面，自己变新的】">                    </form>

target="_self"：跳自己                    target="_blank"：跳新的界面         

明文提交【使用者信息和密码都会被提交】                method="get"

密文提交【不显示信息】    method="post"                            

宽高自适应【根据屏幕，改大小】

宽度自适应和宽度100%区别：

区别在于加页边距（内填充）会产生区别               【搞100%右边的margin或者padding搞不动】

原先的自适应-页边距成现在的自适应

页面距+宽度100%成原先的页面距会溢出容器，超了页边距的距离

高度自适应，宽度自适应：把宽高不定值

搞最小高度：本身高度由自身撑起，再设置最小高度：min-height: 【数值】;     

设最小宽度：min-width: 【数值】；  【本身定小的宽度，再设最小宽度，使宽度为最小宽度】   

窗口自适应100%，把html,body的高都设置成100%

伪元素选择器：

在一大行文本中，选择第一行，box::first-line        {   属性1：属性值    }

在一大行文本中，选择第一个字，box::first-letter        {     属性1：属性值     }

在一个盒子里面的前面插入文本：.box::before{        content: "母猪试图";    }

在一个盒子里面的后面插入文本：.box::after{    content: "拱白菜了";   }

content：文本

浮动高度塌陷【子元素浮动，副容器没高，撑不起来高】

（1）副元素+宽高                                数值太多这也玩完。

（2）用overflow: 【数值】; 通过overflow进入浮动空间

会隐藏需要溢出显示的元素，遮挡太狠

（3）在浮动的东西下边＋盒子【宽，高元素都不加，没啥影响】，盒子里+清除浮动    clear: both;                                

结构不好看，不简便，【搞一个浮动，后面要搞一个清除】

（4）常用清除法【用伪元素后面插文本】                        【扔到公共样式里面，用了就引用】

在一个盒子里面的后面插入文本：.clearfix::after{         content:"";      

   clear: both;        display: block;                         【必然】

height: 0;         overflow: hidden;        }                      

【写一个，要用的去引用名，.clearfix 常用它当名字】

圆角边框：border-radius: 【数值】;                        【挺好看的】

overflow: hidden;和visibility: hidden;        区别

overflow: hidden;        【隐藏不占空间】                visibility: hidden;        【隐藏占空间】

案例有点懵逼，写的感觉对，出不来？【还是不对啊】                成功

CSS里面的calc（）计算

找了下，一般：【属性】: calc(【百分比】  -  【数值+单位】);                                【有点懵】

符号两边+空格                【前面的-】

列子：width: calc(100% - 200px);

符号可+，-，*，/                                                    【按数学计算规则来】           

子绝副相也可搞一块分两栏/三栏，

margin的四个值，顺序：上、右、下、左