-
当执行代码时,css去找标签,并且css样式路径写的越清晰,找的速度越快
-
标签可以使用多个选择器,以空格分割
<div class="div01 div02"></div>
-
布局div 内的内容必须有div包含着,即
<img....> <p>...</p> </div>
-
标准文档流
-
脱离标准文档流
position:absolute; position:fixed; float;
-
未脱离标准文档流
position:relative; position:static;
-
整体布局必须用文档流
-
-
可以用margin:auto居中的
position:relative; position:static;
-
解决高度塌陷的方法
1. 给父元素添加overflow:hidden; 2. 脱离标准文档流:使用绝对定位position:absolute; float; 3. 就拿东西去填充分隔它们。比如padding 和 borde
-
h5 和 html5区别
h5是webapp的设计思想。。;html5行业标准(包括css3、js等)
-
SEO搜索引擎优化
meta:编码;meta:搜索优化;<meta name="robots" content="index,follow"> 遵循百度的规则,可以搜到
html5改变
-
html5新增的语义标记(无样式,只是语义)
区块标签:article、section、nav(导航)、aside(侧边栏)、header、footer 内容分组标签:figure(插图)、figcaption、main 文本级别标签:time
<body> <div class="container"> <header></header> <section> <div class="center"> <main> <header></header> <article></article> </main> </div> </section> <footer></footer> </div> </body> ```
-
智能表单
<form action="" id="my_form" name="login_form" method="get" enctype="application/x-www-form-urlencoded">
- action为空表示交给自己
- 后台根据 name 获取数据
- outline:none;设置无外边框,点击无抖动
-
minlength和maxlength:
<input type="text" id="my_name" name="login_name" class="input-user-name" maxlength="12" minlength="6">
-
新增input类型
1. <input type="email"> 2. <input type="date"> 3. <input type="number" min="1" max="100" step="5"> 必须为数字,min最小值,max最大值,step步长 4. <input type="range" max="100" min="0" step="1" id="input_range" onchange="rng_v.value=this.value"><input type="text" id="rng_v"> 滑动条 5. <input type="color"> 颜色盘 6. <progress value="50" min="0" max="100"></progress>进度条
-
属性
<form action="" id="my_form1" name="login_form" method="get" enctype="application/x-www-form-urlencoded"> <!--form 中的novalidate属性是不验证提交--> <input type="text" required> <!--非空验证--> <input type="text" placeholder="请输入姓名"><!--提示文字--> <input type="text" autofocus><!--自动聚焦:光标位置--> <input type="text" pattern="1[345678]\d{9}"><!--正则表达式--> </form>
-
input配合datalist
<form action=""> <input type="text" list="search" placeholder="选择省份"> <datalist id="search"> <option value=""></option> </datalist> </form>