龙空技术网

HTML表单及css样式

he392140685 32

前言:

此刻兄弟们对“网页中的css样式”大体比较关注,姐妹们都需要知道一些“网页中的css样式”的相关资讯。那么小编也在网摘上网罗了一些有关“网页中的css样式””的相关文章,希望朋友们能喜欢,咱们一起来学习一下吧!

一、表单:

网页仅有表单才能接收用户输入信息、并将信息提交到服务器进行处理。

表单在网页中主要负责数据采集功能。一个表单有三个基本组成部分: 表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。 表单域:包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。 表单按钮:包括提交按钮、复位按钮和一般按钮;用于将数据传送到服务器上的CGI脚本或者取消输入,还可以用表单按钮来控制其他定义了处理脚本的处理工作。

二、制作规范的表单

<form name="表单名称" method="提交的方式:get|post" action="处理表单的服务器地址">

一系列的表单对象

提交按钮:<input type="submit" value="提交" name="sum" />

</form>

注意:表单必须要有提交按钮,作用:当点击提交钮时,会自动将表单中的数据提交到表单action属性所指定的地址进行处理.

三、定义表单对象

1.使用input标签定义表单对象

<input type="元素类型" name="表单对象名称" value="表单对象的值">

1.1 type的类型:

text(文本框)、password(密码框)、checkbox(复选框)、radio(单选按钮)

submit(提交按钮)、reset(重置按钮)、file(文件域)、button(按钮)、

image(图片域:具备提交按钮)、hidden(隐藏域)、

date(日期控件:html5新增的)、number(数字调节器:html新增的)

2.使用select标签定义下拉列表

<select name="sel">

<option value="项值">项文本</option>

<option value="研究生">研究生</option>

<option value="本科">本科</option>

....

</select>

3.使用textarea定义文本域:

<textarea cols="80" rows="8">请输入内容</textarea>

四、常用表单对象的属性

1.文本框:

<input type="text" name="uname" value="Admin" maxlength="最大字符数:15" size="文本框长度:10" readonly="只读:readonly"/>

2.设置单选框和复选框的默认选中

checked="checked"属性

3.使用selected属性设置下拉列表的选中项

<option value="本科" selected="selected">本科</option>

来自网络

五、css(Cascading style sheet):级联(层叠)样式表。

1.作用:修饰html标签

2.优势:

内容与表现分离;

网页的表现统一,容易修改;

丰富的样式,使得页面布局更加灵活;

减少网页的代码量,增加网页的浏览速度,节省网络带宽;

运用独立于页面的CSS,有利于网页被搜索引擎收录。

六、在html文档添加css样式的方法。

1.行内样式:使用标签的style属性添加样式

<标签 style="一系列的样式规则">

样式规则的格式:样式属性:样式属性值;

2.内部样式:使用style标签定义样式

<style type="text/css">

一系的样式选择器(选择器必需先定义,后引用)

</style>

注意:通常情况style标签放在head标签中。

2.1基本选择器分类:类选择器、Id选择器、标签选择器

2.2使用类选择器

定义类选择器

.类选择器名{一系列样式}

引用类选择器:使用标签的class属性引用类选择器名称

2.3使用Id选择器

定义id选择器

#id选择器名{一系列样式规则}

引用ID选择器:使用标签的ID属性引用ID选择器名称

2.4定义标签选择器

标签名称{一系列样式规则}

引用标签选择器:当使用该标签时自动套动标签样式

3.外部样式:

外部样式是将一系列样式选择器定义在外部样式文件(**.css)中

3.1在网页使用link标签引用外部样式文件

<link href="index.css" type="text/css" rel="stylesheet" />

七、样式优先级(就近原则)

行内样式>内部样式>外部样式

id选择器>类选择器>标签选择器

八、高级选择器(复合选择器)

1.层选选择器

1.1后代选择器

定义后代选择器

选择器1 选择器2{一系列样式规则}

使用:必需先用选择器1,再使用选择器2,且选择器存在层次关系

1.2子选择器

定义子选择器

选择器1>选择器2{一系列样式规则}

使用:必需先用选择器1,再使用选择器2,且选择器存在父子关系

1.3相邻兄弟选择器

定义相邻兄弟选择器

选择器1+选择器2{一系列样式规则}

使用:必需先用选择器1,再使用选择器2,且相邻的

1.4通用相邻兄弟选择器

定义通用相邻兄弟选择器

选择器1~选择器2{一系列样式规则}

使用:必需先用选择器1,再使用选择器2,且相邻之后的所有兄弟

2.交集选择器

定义交集选择器

标签选择器类选择器|id选择器

使用:使用标签的同时还引用类或者id选择器

3.并集选择器

定义并集选择器

选择器1,选择器2

使用:使用选择器1 或者 选择器2 都行

九、span标签

文本标签,由内容决定自身大小。

标签: #网页中的css样式 #html怎么调用css #html标签默认的样式 #htmltag标签 #html重置表单