e 1 year ago
parent
commit
fab5489109

+ 18 - 4
day1/html/标签.html

@@ -104,11 +104,11 @@
                    <img src="../images/R-C.jpg" alt="风景图" style="width:200px;height:200px">
                    <img src="../images/R-C.jpg" alt="风景图" style="width:200px;height:200px">
                 <p>
-                    新的内容新的<span style="background-color: aqua;">内容222</span>新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容
+                    新的内容新的<span style="background-color: aqua;">内容222</span>新的内容新的内容新的内容新的1<br>内容新的内容新的内容新的内容新的内容新的内容新的内容<hr>新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容新的内容
                 </p>
                 <p>这是一段<b>内容</b>222这是一段<strong>内容</strong>这是一段内容这是一段内容这是一段内容
                     <br>这是一段内容这是一段<i>内容</i>333这是一段<em>内容</em>这是一段内容<hr>这是一段内容这是一段内容</p>
-                    <hr><hr><hr><hr>
+                
                 <p>1这是一段<sub>内容1</sub>这是一段<sup>内容</sup>这是一段<u>内容2</u>这是一段<s>内容3</s>这是一段内容这是一段内容这是一段内容
                     <hr>这是一段内容这是一段内容这是一段内容这是一段内容</p>
                     <!-- 无序列表
@@ -119,11 +119,16 @@
                                   circle 空心圆
                                   disc   实心圆(默认的)
                     -->
-                <ul type="disc">
+                    <ul type="disc">
+                        <li>内容</li>
+                        <li>内容</li>
+                        <li>内容</li>
+                    </ul>
+                <!-- <ul type="disc">
                     <li>内容1</li>
                     <li>内容2</li>
                     <li>内容3</li>
-                </ul>
+                </ul> -->
                 <!-- 有序列表 
                     ol li 标签组成 有序列表
                     属性: type: A  a  i(罗马数字) 1(默认:阿拉伯数字)
@@ -137,7 +142,16 @@
                     <li>内容</li>
                     <li>内容</li>
                     <li>内容</li>
+                    <li>内容</li>
                 </ol>
+                <!-- <ol type="1" reversed>
+                    <li>内容</li>
+                    <li>内容</li>
+                    <li>内容</li>
+                    <li>内容</li>
+                    <li>内容</li>
+                    <li>内容</li>
+                </ol> -->
                 <!-- 图片文件夹名称:images -->
                 <!-- 图文混排列表
                     dl dt dd

+ 28 - 0
day2/demo1.html

@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8">
+        <title>demo1</title>
+    </head>
+    <body>
+        <div>
+            <h3>欢迎注册网易免费邮箱</h3>
+            <p>手机号码@163.com,方便好记</p>
+            <form action="">
+                <!-- label:input框前的元素标记 -->
+                <label>手机号</label>
+                <input type="text" placeholder="手机号码">
+                <br>
+                <br>
+                <label>密码</label>
+                <input type="password" placeholder="密码">
+                <br>
+                <br>
+                <input type="checkbox">同意《服务条款》、《隐私政策》和《儿童隐私政策》
+                <br>
+                <br>
+                <input type="button" value="立即注册">
+            </form>
+        </div>
+    </body>
+</html>

BIN
day2/images/R-C.jpg


BIN
day2/images/img01.gif


BIN
day2/images/img01.jpeg


BIN
day2/images/img02.jpeg


BIN
day2/images/img03.jpeg


BIN
day2/images/img04.jpeg


+ 55 - 0
day2/表单.html

@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8">
+        <title>表单</title>
+    </head>
+    <body>
+        <!-- form 标签 => 表单
+            action 规定提交表单像提交处发送的表单数据
+            input 输入框 行内块元素
+            属性:
+            1.placeholder 默认的提示信息 颜色是灰色
+            2.value 值
+            3.type
+                text 文本(默认)输入框
+                button 按钮 (按钮名称可以自定义)
+                submit 提交按钮
+                reset 重置按钮
+                radio 单选框 注意:name值必须相同才生效
+                checkbox 复选框(多选框)disabled 禁止选择 checked 选中状态
+                password 密码
+        -->
+        <form action="">
+            <input type="text" placeholder="请输入您的电话号码" value="1212">
+            <input type="submit">
+            <input type="reset">
+            <input type="radio" name="same">男
+            <input type="radio" name="same">女
+            <input type="checkbox" disabled>音乐
+            <input type="checkbox" checked>美术
+            <input type="checkbox">跳舞
+            <input type="checkbox">口才
+            <input type="password">
+            <!-- 下拉框
+                select 表单中的控件
+                option 表单中的选项
+                select 和 option 共同组成下拉框 缺一不可
+                selected 默认选中
+                disabled 禁止选中
+            -->
+            <select>
+                <option value="1">1</option>
+                <option value="2" selected>2</option>
+                <option value="3" disabled>3</option>
+                <option value="4">4</option>
+            </select>
+            <!-- 文本域 textarea
+                rows 行
+                cols 列
+                maxlength 可以输入的最大长度
+            -->
+            <textarea cols="15" rows="8" maxlength="10"></textarea>
+        </form>
+    </body>
+</html>

+ 64 - 0
day2/表格.html

@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8">
+        <title>表格</title>
+    </head>
+    <body>
+        <!-- 
+            table表格标签 双标签
+            border 边框 在table中添加
+            th 表格的头部
+            td 表格的主体
+            tr 表格的行
+            cellpadding 内容和单元格边框的距离
+            cellspacing 边框和边框之间的距离
+            caption 标题标签
+            align 位置:left(左) center (中间) right(右侧)
+            bgcolor 单元格的背景色 不推荐使用
+            rowspan 合并行
+            colspan 合并列
+         -->
+         <table border="1" cellpadding="20">
+            <caption>课程表</caption>
+            <tr>
+                <!-- thead -->
+                <th rowspan="2">周一</th>
+                <th>周二</th>
+                <th>周三</th>
+                <th>周四</th>
+                <!-- 表头 -->
+            </tr>
+            <tr>
+                <!-- <td bgcolor="red">1</td> -->
+                <td colspan="0">2</td>
+                <td>3</td>
+                <td>4</td>
+                <!-- 内容 -->
+            </tr>
+            <tr>
+                <td>1</td>
+                <td colspan="3" align="center"  style="background: url(./images/R-C.jpg);">2</td>
+                <!-- <td>3</td> -->
+                <!-- <td>4</td> -->
+                <!-- 内容 -->
+            </tr>
+            <tr>
+                <!-- tbody -->
+                <td>1</td>
+                <td>2</td>
+                <td>3</td>
+                <td>4</td>
+                <!-- 内容 -->
+            </tr>
+            <tr>
+                <!-- tbody -->
+                <td>1</td>
+                <td>2</td>
+                <td>3</td>
+                <td>4</td>
+                <!-- 内容 -->
+            </tr>
+         </table>
+    </body>
+</html>

+ 76 - 0
day2/课程表.html

@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8">
+        <title>课程表</title>
+    </head>
+    <body>
+        <table border="1">
+            <caption>课程表</caption>
+            <tr>
+                <th>课程\星期</th>
+                <th>星期一</th>
+                <th>星期二</th>
+                <th>星期三</th>
+                <th>星期四</th>
+                <th>星期五</th>
+            </tr>
+            <tr>
+                <td>第一节</td>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td></td>
+            </tr>
+            <tr>
+                <td>第二节</td>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td></td>
+            </tr>
+            <tr>
+                <td>第三节</td>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td></td>
+            </tr>
+            <tr>
+                <td>第四节</td>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td></td>
+            </tr>
+            <tr>
+                <td colspan="6" align="center">午休</td>
+                <!-- <td></td>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td></td> -->
+            </tr>
+            <tr>
+                <td>第五节</td>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td></td>
+            </tr>
+            <tr>
+                <td>第六节</td>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td></td>
+            </tr>
+        </table>
+    </body>
+</html>