صفحهٔ اصلی گشت‌و‌گذار راهنما
ورود
lovecoding
/
vipAllDay
10
0
انشعاب 0
پرونده‌ها مشکلات 0 درخواست واکشی 0 ویکی
فهرست منبع

html

e 11 ماه پیش
والد
2aa45033ea
کامیت
d46ce52c97
4فایلهای تغییر یافته به همراه135 افزوده شده و 1 حذف شده
مشاهده تقسیم شده نمایش آمار تفاوت ها
  1. 3 1
      html/2.标签.html
  2. 65 0
      html/3.表单标签.html
  3. 46 0
      html/4.表单案例1.html
  4. 21 0
      html/5.表单案例2.html

+ 3 - 1
html/2.标签.html
مشاهده فایل 

@@ -28,7 +28,8 @@
 
         标签：开始标签 结束标签
 
         1.文档标签： 文档流
 
         2.按照是否换行去分：块级元素 与 行内元素 
-        行内块元素：一行显示 可以设置宽高   
+        行内块元素：一行显示 可以设置宽高  
+          img input
 
         3.按照是否闭合区分 
           闭合标签：由开始标签与结束标签组成中间允许嵌套内容
 
           空标签：由开始标签组成自动闭合
 
@@ -113,6 +114,7 @@
 
     </ol>
 
     <!-- 
         行内元素:在一行内显示
 
+        span 行内元素分块
 
         b 加粗 单纯加粗
 
         strong 加粗 语义上的加粗
 
         i 倾斜 单纯的倾斜

+ 65 - 0
html/3.表单标签.html
مشاهده فایل 

@@ -0,0 +1,65 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <!-- 表单：form 
+    属性：action 向服务端提交客户端内容
 
+        1.input 输入框
 
+            属性：
 
+            a.placeholder 提示信息
 
+            b.type 类型
 
+            text 文本类型
 
+            password 密码
 
+            submit 提交按钮
 
+            reset 重置按钮
 
+            button 自定义按钮 配合value属性一起使用
 
+            radio 单选 切记name属性相同
 
+            checkbox 多选 checked默认选择 disabled 禁止选中
 
+    -->
 
+    <form action="">
 
+        <input type="text" placeholder="哈哈哈哈哈">
 
+        <br>
 
+        <input type="password">
 
+        <br>
 
+        <input type="submit">
 
+        <br><br>
 
+        <input type="reset">
 
+        <br><br>
 
+        <input type="button" value="再来一次">
 
+        <br><br>
 
+        <input type="radio" name="111">男 
+        <input type="radio" name="111">女
 
+        <br><br>
 
+        <input type="checkbox">篮球
 
+        <input type="checkbox" checked>足球
 
+        <input type="checkbox" disabled>羽毛球
 
+        <input type="checkbox">排球
 
+        <br><br><br>
 
+        <!-- 
+            2.下拉框
 
+            select 与 option 一起组成
 
+            selected 默认选择
 
+            disabled 禁止选中
 
+        -->
 
+        <select>
 
+            <option value="第一">1</option>
 
+            <option value="第二" selected>2</option>
 
+            <option value="第三">3</option>
 
+            <option value="第四" disabled>4</option>
 
+        </select>
 
+        <br><br><br>
 
+        <!-- 
+            3.文本域
 
+                textarea
 
+                cols列
 
+                rows行
 
+                maxlength 最大长度
 
+         -->
 
+         <textarea  cols="10" rows="20" maxlength="10"></textarea>
 
+    </form>
 
+</body>
 
+</html>

+ 46 - 0
html/4.表单案例1.html
مشاهده فایل 

@@ -0,0 +1,46 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <div>
 
+        <h1>注册信息</h1>
 
+        <form action="">
 
+            用户名：<input type="text" placeholder="请输入用户名">
 
+            <br>
 
+            密码：<input type="password" placeholder="请输入密码">
 
+            <br>
 
+            性别：<input type="radio" name="11">男 <input type="radio" name="11">女
 
+            <br>
 
+            兴趣爱好：
 
+            <input type="checkbox">足球
 
+            <input type="checkbox" checked>篮球
 
+            <input type="checkbox">排球
 
+            <input type="checkbox">游泳
 
+            <input type="checkbox" disabled>网球
 
+            <input type="checkbox">旅游
 
+            <input type="checkbox">绘画
 
+            <input type="checkbox">读书
 
+            <br>
 
+            最高学历：
 
+            <select name="" id="">
 
+                <option value="1">小学</option>
 
+                <option value="2">初中</option>
 
+                <option value="3">高中</option>
 
+                <option value="4">大学</option>
 
+            </select>
 
+            <br>
 
+            个人说明：
 
+            <textarea cols="30" rows="10"></textarea>
 
+            <br>
 
+            <input type="reset">
 
+            <input type="button" value="注册">
 
+            <br>
 
+            <a href="#">提示：注册成功后点击这里你将直接<span style="color: #f00;">登录系统</span>！</a>
 
+        </form>
 
+    </div>
 
+</body>
 
+</html>

+ 21 - 0
html/5.表单案例2.html
مشاهده فایل 

@@ -0,0 +1,21 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <div>
 
+        <h2>欢迎注册网易免费邮箱</h2>
 
+        <p>手机号码@163.com方便好记</p>
 
+        手机号：<input type="text" placeholder="手机号码">
 
+        <br><br>
 
+        密码：<input type="text" placeholder="密码">
 
+        <br><br>
 
+        <input type="checkbox">同意《服务条款》、《隐私政策》和《儿童隐私政策》
 
+        <br><br>
 
+        <input type="button" value="立即注册">
 
+    </div>
 
+</body>
 
+</html>