码迷,mamicode.com
首页 > Web开发 > 详细

html笔记3

时间:2017-11-05 00:35:29      阅读:230      评论:0      收藏:0      [点我收藏+]

标签:ref   奇数   sub   pass   submit   mit   ado   验证   sheet   

第三章 表单
1.语法
<form method="get|post" action="数据向哪提交的地址">
//表单内容
</form>

2.input 标签常用属性
<input name="标签名" type="标签类型" value="标签默认值"/>
size:输入文本框的字符的长度
maxlength:文本框的宽度
checked: 单选框和复选框的默认选中.
selected: 下拉框的默认选中

3.常用标签
text //文本框
password //密码框
radio //单选按钮
checkbox //复选框
button //按钮
submit //提交按钮
reset //重置按钮
url //只能输入网址
emial //只能输入邮箱
number //只能输入数字
file //文件域
range //滑块
search //搜索框
其他标签
<select> :下拉框
<option></option> 选项
</select>
<textarea></textarea> 文本域
<!--radio和checkbox中的name属性值需要保持一致,才能到达单选或者多项的作用.--!>

4.表单的高级应用
hidden //隐藏域
readonly // 只读
disabled // 禁用

5.表单元素的标注
例:
<label for="id值"> 男</label>
<input type="radio" id="id值"/>

6.表单初级验证的方法
placeholder //提示
required //必填项
pattern //正则表达式(输入的内容必须符合这个表达式的要求)

第四章 初识CSS
1.CSS(层叠样式表)
2.CSS语法
选择器{
属性名1:属性值1;
属性名2:属性值2;
}
3.引用CSS的三中方式
第一种: 行内样式
例: <a style="color:red;">内部样式</a>
第二种: 内部样式
在head标签中,写入style标签.
例:
<head>
......
<style type="text/css">
h1{
......
}
</style>
</head>
第三种: 外部样式
使用步骤:
a) 创建一个以.css为后缀的文件(css文件)
b) 在html中通过link引入css文件
<link rel="stylesheet" href="css文件路径"/>
4.基本选择器
4.1 标签选择器
标签名{}
4.2 类选择器
.class属性值{}
4.3 id选择器
#id属性值{}
5.层次选择器
5.1 后代选择器
父元素 子元素{}
5.2 子选择器
父元素>子元素{}
5.3 相邻兄弟选择器
本元素+相邻兄弟元素{}
5.4 通用兄弟选择器
本元素~兄弟元素{}
6.结构伪类选择器
E F:first-child{} //第一个子元素
E F:last-child{} //最后一个子元素
E F:nth-child(?){} // ?表示第几个子元素,还可以使odd奇数,even偶数
E F:first-of-type{} //指定类型的第一个元素
E F:last-of-type{} //指定类型的最后一个元素
E F:nth-of-type(?){} //?表示指定类型第几个子元素
注意:
E F:nth-child(n)在父级里从一个元素开始查找,不分类型.
E F:nth-of-type(n)在父级里先看类型,再看位置.
7. 属性选择器
E[attr] //具有属性attr的元素
E[attr=val] //属性attr的值是val的元素
E[attr^=val] //属性attr的值以val开头的元素
E[attr$=val] //属性attr的值以val结尾的元素
E[attr*=val] //属性attr的值包含val的元素






html笔记3

标签:ref   奇数   sub   pass   submit   mit   ado   验证   sheet   

原文地址:http://www.cnblogs.com/jie555/p/7784959.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!