从建站到拿站 -- HTML和CSS基础

简介: 从建站到拿站 -- HTML和CSS基础

一线城市容不下自己的肉身,三四线城市容不下自己的灵魂。。。

----  网易云热评

一、Form表单简介

表单是允许用户在表单中输入内容,比如用户名和密码,并将信息提交到服务器

二、简单表单

action:将输入框的内容提交到那服务器

method:提交方式,GET方式(有长度限制)和POST方式

<!DOCTYPE html>  <!-- 有助于浏览器中正确显示网页 -->

<html>  <!-- html页面开始标签 -->

<head>

<meta charset="UTF-8">  <!-- UTF-8编码  -->

<title>登录</title> <!-- 标签页显示的内容 -->

</head>

<body style="text-align:center;">

请输入用户名和密码

<form action="bucuo.php" method="get" target="_blank">

用 户 名: <input type="text" name="user">

密    码:<input type="password" name="pass1">

<input type="reset">

<input type="submit" name="submit" value="登录">

</form>

</body>

</html> <!-- html页面结束标签 -->

image.png

三、相关标签介绍

1、input标签

输入框和密码框

用 户 名:<input type="text" name="user">

密    码:<input type="password" name="pass1">

单选按钮

性    别:<input type="radio" name="sex1">男<input type="radio" name="sex2">女

多选按钮

爱    好:<input name="cg" type="checkbox">唱歌<input name="tw" type="checkbox">跳舞<input name="kdy" type="checkbox">看电影

文件上传按钮

头像上传:<input type="file" name="tx">

重置和提交按钮

<input type="reset">

<input type="submit" name="submit" value="提交">

2、textarea标签,文本域,可以输入多行内容

头像上传:<input type="file" name="tx">

image.png

3、iframe标签,内联框架,可以理解为在一个网页内又镶嵌了一个网页

src:设置框架内默认显示的网页

width:设置框架的宽度

frameborde:设置框架是否有边框

name:设置框架的标识名

scrolling:设置滚动条

 

<a href="http://192.168.1.129/html/zc.html" target="ay"> 注册</a>

<a href="http://192.168.1.129/html/dl.html" target="ay"> 登录</a>

<iframe src="http://www.baidu.com" name="ay" width="100%" frameborder="0"><iframe>

 

image.png

 

作业要求:新建两个HTML页面,一个注册页面,一个登录页面

禁止非法,后果自负

目录
相关文章
|
16天前
|
前端开发 JavaScript 开发工具
【HTML/CSS】入门导学篇
【HTML/CSS】入门导学篇
23 0
|
7天前
|
数据采集 前端开发 网络协议
如何使用代理IP通过HTML和CSS采集数据
如何使用代理IP通过HTML和CSS采集数据
|
11天前
|
前端开发 搜索推荐 数据安全/隐私保护
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
18 1
|
12天前
|
PHP
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
|
18天前
|
JSON JavaScript 前端开发
js是什么、html、css
js是什么、html、css
|
20天前
|
XML 前端开发 JavaScript
css和html
【4月更文挑战第7天】css和html
13 0
|
24天前
|
人工智能 前端开发 JavaScript
【前端设计】HTML+CSS+JavaScript基本特性
【前端设计】HTML+CSS+JavaScript基本特性
|
1月前
|
前端开发 容器 内存技术
使用CSS3画出一个叮当猫HTML源码
本文教程介绍了如何使用CSS3绘制叮当猫,通过HTML结构和CSS样式逐步构建叮当猫的各个部位,如头部、脸部、脖子、身体、手脚等。代码示例展示了如何利用渐变、边框、阴影和定位技巧实现三维效果和细节特征。此外,还添加了眼珠的动画效果,让叮当猫的眼睛能够转动。整个过程适合对CSS3感兴趣的读者参考学习,以提升动态图形创作技能。
16 0
使用CSS3画出一个叮当猫HTML源码
|
1月前
|
XML 编解码 前端开发
编程笔记 html5&css&js 033 HTML SVG
编程笔记 html5&css&js 033 HTML SVG