首页 > 代码库 > 前端初步预习(4)
前端初步预习(4)
第四天
是基础班的第一天
老师讲解的是表格(table){<tr>行, <td>列(列可以加入其它标签:例如<h1>标题标签)}
<table> <tr> <td></td> <td></td> </tr> <tr> <td></td> <td></td> </tr> </table>
- table的属性:
border:表格边框
width:给表格设置宽
height:给表格设置高
cellspacing:单元格之间的空隙
sellpadding:单元格边框和内容的空白
表格其它标签(以下都是双标签)
<th>起表头作用
<thead>用来存放表头
<tbody>用来存放表格内容
<caption>表格标题
表单 (from)
输入框:input , 设置提示语:placeholder , 默认值:value , 类型:type
<form> <p>用户名:<input type="text" placeholder="请输入用户名"></p> <p>密 码:<input type="password" placeholder="请输入密码"></p> <p>性 别:<input type="radio" name="sex">男<input type="radio" name="sex">女</p> <p>爱 好:<input type="checkbox" name="one">吃饭<input type="checkbox" name="two">睡觉<input type="checkbox" name="three">打豆豆</p> <p>出生日期:<select name="nian"> <option value="">1990</option> <option value="">1991</option> <option value="">1992</option> <option value="">1993</option> <option value="">1994</option></select>年 <select name="yue"> <option value="">1</option> <option value="">2</option> <option value="">3</option> <option value="">4</option> <option value="">5</option></select>月 <select name="nian"> <option value="">30</option> <option value="">29</option> <option value="">28</option> <option value="">27</option> <option value="">26</option></select>日 </p> <p>自我评价:<textarea cols="50" rows="10"></textarea></p> <p><a href="#">注册</a> <input type="reset" name=""></p> </form>
- input系列
type{text文本,password密码,button按钮,cheakbox复选框,radio单选框,submit提交,reset重置,textarea文本域{cols宽,rows高},
image图片按钮)
下拉框内容写在<option>中
下拉默认值设置:selected="selected"
单选默认值设置:checked="checked"(name="名字"设置一样,形成互斥效果)
多选默认值设置:checked="checked"
div(块级元素)
布局标签,默认占一整行,作为容器布局的时候使用
span
可一行排列多个,大小由内容决定
css:层叠样式表
作用:美化页面
写在<head>中 <style>样式 </style>
- 书写方式
行内式:样式写在同行内:例<div style="color:red;"></div>
外联式:<link rel="stylesheet" herf="xxx.css"
内联式:样式写在同一页的<style></style>
- 语法结构:
选择器{
属性:属性值;(!!!每个属性都有相对应的值)
}
color
英文表示:red......十六进制颜色表示法:color:#RRGGBB; (两位红色,两位绿色,两位蓝色)
三原色:红,绿,蓝
color:rgb(225,225,o)
可用数字最大为255,最小为0,超出以255处理
可用百分比 最小0%,最大为100%
前端初步预习(4)