一、需要记下的html5知识
1.html5网页文本框架
<!DOCTYPE html> <html> <head></head> <body></body> <foot></foot> </html>
2.简单标签
<!-- h标签，表示标题，h1-h5 --> <h1>标题一</h1> <h2>标题二</h2> <h3>标题二</h3> <h4>标题二</h4> <h5>标题二</h5> <!-- p标签，表示文本段落 --> <p>今天是个好天气啦啦啦啦啦啦啦啦啦啦</p> <!-- a标签，表示链接--> <a href="www.baidu.com">打开百度</a> <!-- 打开新的标签页 --> <a href="www.baidu.com" target="_blank">打开百度</a> <!-- img标签，表示图片, alt属性表示对图片的解释 --> <img src="./cat.jpg" alt="一只猫"/> <!-- 无序列表 --> <ul> <li>无序列表1</li> <li>无序列表2</li> <li>无序列表3</li> </ul> <!-- 有序列表, type类型有1,A,a,I,i，start为开始值 --> <ol type="1" start="2"> <li>有序列表1</li> <li>有序列表2</li> <li>有序列表3</li> </ol>
3.表单标签
<!-- form表单标签，action代表表单跳转的位置 --> <form action="#" method="get"> <!-- 单选框，注意label的for属性和input的id属性对应，另外注意一组单选框的name值一致 --> <!-- checked 表示默认选中 --> <label for="indoor"> <input type="radio" id="indoor" value="indoor" name="in-out" checked>indoor </label> <label for="outdoor"> <input type="radio" id="outdoor" value="outdoor" name="in-out">outdoor </label> <!-- 多选框 --> <label for="happy"> <input type="checkbox" id="happy" name="personality" checked>happy </label> <label for="thin"> <input type="checkbox" id="thin" name="personality">thin </label> <label for="smart"> <input type="checkbox" id="smart" name="personality">smart </label> <!-- 输入框 --> <!-- placeholder为占位提示信息，required 属性表示必填项 --> <input type="text" placeholder="请输入姓名" required> <!-- 提交按钮 --> <button type="submit">提交表单</button> </form>
4.结构标签
<!-- main标签可以优化seo --> <main> <p>主要文本1</p> <p>主要文本2</p> </main> <!-- div为块标签，后续会大量应用 --> <div> <div>div1</div> <div>div2</div> </div>
