首页 > 代码库 > Html踩坑集锦
Html踩坑集锦
行内标签根据自己的内容撑开 用width宽度没有作用 eg:<span>
p元素文字无论有多少个空格 html只显示一个空格
> 大于号 > < 小于号 < © 版权号 " 双引号
img ../ 上一级文件夹 eg: ../img/1.jpg
img alt属性 如果图片未加载成功 会有文字说明
img title属性 鼠标悬停显示的文字说明
图片如果只设置宽度或高度 会自适应比例
宽度高度都设置 会强制拉伸缩小
ul 有序列表 ol 无序列表
dl dt dd 自定义
表格：table th第一行头部 tr行 td单元格 <table cellspacing="1" border="1" >
cellspacing属性是“外边距” 单元格之间的空隙距离 上下左右的空间都改变
cellpadding 内边距
<tr><th>头第一行加粗字体th</th></tr>
<tr><td>正常单元格</td></tr>
横向对齐方式 align：“left/center/right” 纵向对齐方式 valign: "top/middle/bottom"
表格标题：caption
跨列（包括本身的列）属性：colspan
跨行属性：rowspan
thead tbody 语义化
制作表格先把多少行列写出来再改样式
高度的百分比是对浏览器没有作用的
action
是要写的属性值 是 服务器的有效地址 向服务器提交表单信息
method
get 以地址形式提交数据 （url） 欠缺安全性 提交的数据量较小
post （请求头）提交数据 安全性较好 提交的数据量较大
表单提交必须有name
表单name 是给后端查看
value 当前的值 单复选框也要必须写value （后端需要）
单选框 如男女只能选一个 name必须要一致
默认选 checked
input button 不能用来表单提交 可以用来触发脚本效果
<button>可以提交表单 必须在form表单里
type="submit" <button> type="image" 这三个可以提交表单
fieldset域（用得少） legend
1 <form action=""method="get"> 2 <fieldset> 3 <legend>用户名 密码</legend> 4 用户名：<input type="text" name="username" value="用户名"/><br/> 5 6 密 码：<input type="password" name="password"/><br/> 7 </fieldset> 8 9 照 片：<input type="file" name="photo"/><br/> 10 11 生 日：<select name="sel" id=""> 12 <option value="">1988</option> 13 <option value="">1989</option> 14 <option value="">1990</option> 15 <option value="">1991</option> 16 </select>年<br/> 17 18 城 市：<select name="city" id="city"> 19 <option value="1">北京</option> 20 <option value="2" selected>上海</option> 21 <option value="3">广州</option> 22 </select><br/> 23 24 性 别：<input type="radio" checked name="gender" value="1"/>男 <input type="radio" name="gender" value="0"/>女<br/> 25 26 爱 好： <input type="checkbox" name="ck" value="1"/>吃 27 <input type="checkbox" name="ck" value="2"/>喝 28 <input type="checkbox" name="ck" value="3"/>玩 29 <input type="checkbox" name="ck" value="4"/>乐<br/> 30 31 <textarea name="ta" id="ta" cols="30" rows="10" readonly>协议</textarea><br/> 32 33 <input type="submit" value="登录"/> 34 35 <input type="button" value="搜索"/> 36 37 <input type="reset" value="重置"/> 38 39 <button disabled>注册2</button> 40 41 <input type="image" src="img/wallhaven-245065.png" width="50px"/> 42 43 44 </form>
Html踩坑集锦
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。