【免费】网页-分知识点简单练习（html）资源-CSDN文库

共77个文件

html：38个

png：19个

jpg：11个

需积分: 0 133 浏览量 2024-01-08 10:55:38 上传评论收藏 1.31MB ZIP 举报

网页制作是数字时代不可或缺的一项技能，HTML（HyperText Markup Language）作为网页制作的基础语言，扮演着至关重要的角色。本练习旨在帮助你深入理解和熟练运用HTML，通过实践来巩固相关知识点。 1. HTML基本结构：每个HTML文档都由<!DOCTYPE html>声明开始，表示文档类型，接着是<html>元素，它是整个页面的根元素。在<html>内部，有<head>和<body>两个主要部分。<head>包含元信息，如<title>用于定义页面标题，而<body>则包含用户在浏览器中看到的实际内容。 2. 标题元素：HTML提供了<h1>到<h6>六级标题，用于组织文档结构。h1代表最高级别的标题，h6是最小的标题。正确的使用标题有助于搜索引擎优化（SEO）和页面的可读性。 3. 段落与换行：<p>标签用于创建段落，而<br>标签用于强制换行，它们是文本内容的基本组成部分。 4. 文本格式化：<strong>使文本加粗，<em>使文本斜体，<del>表示删除线，<ins>表示下划线，<u>也表示下划线但含义略有不同，用于表示拼写错误或需特别关注的文本。 5. 链接：<a>标签用于创建超链接，通过href属性指定链接目标。例如：<a href="http://www.example.com">访问示例网站</a>。 6. 图像：<img>标签插入图像，src属性指向图片的URL，alt属性提供替代文字，当图片无法显示时，用户仍能理解内容。 7. 列表：<ul>和<ol>分别用于无序和有序列表，<li>是列表项。例如： ``` <ul> <li>第一项</li> <li>第二项</li> </ul> ``` 8. 表格：<table>元素创建表格，<tr>表示行，<th>表示表头，<td>表示单元格。例如： ``` <table> <tr> <th>姓名</th> <th>年龄</th> </tr> <tr> <td>张三</td> <td>25</td> </tr> </table> ``` 9. 表单：<form>用于创建交互式表单，<input>元素用于输入数据，如文本、密码、复选框等。<label>标签用于描述输入字段，<button>创建按钮。例如： ``` <form> <label for="username">用户名：</label> <input type="text" id="username" name="username"><br> <input type="submit" value="提交"> </form> ``` 10. CSS样式：虽然不是HTML，但CSS（Cascading Style Sheets）用于美化HTML页面。可以使用<style>标签在HTML文档中内联定义样式，或者通过<link>引用外部样式表。了解基本的CSS选择器、属性和值，如color、font-size、background-color等，可以提升网页设计的灵活性和美观度。通过这些HTML知识点的练习，你可以构建出功能丰富的静态网页。不断实践和探索，你会发现HTML的世界既有趣又实用。在网页制作实操过程中，尝试将这些元素结合，创建出符合需求的网页布局和交互，逐步提升你的网页制作技能。

资源推荐

资源详情

资源评论

收起资源包目录

网页制作实操.zip （77个子文件）

网页制作实操

11月2日网页实操

2.html 470B

约瑟夫圆桌问题.html 725B

计时.html 1KB

5.html 616B

3.html 649B

4.html 655B

1.html 625B

折纸.html 522B

下拉菜单.html 808B

加法.html 462B

sc.css 415B

10月19日网页实操

5-3 ——精美电商.html 362B

2.jpg 1KB

精美电商.jpg 12KB

55555.css 377B

5-12熊猫.html 461B

实训第五章素材images.rar 254KB

panda.jpg 12KB

tubiao.jpg 932B

2.css 492B

2.png 1KB

（2）电商团购.html 408B

10月26日网页实操

icon8.png 2KB

3.css 438B

超链接的伪类选择器.html 459B

icon6.png 2KB

play2.png 933B

iconh.png 1KB

icon1.png 3KB

icon4.png 2KB

icon5.png 2KB

icon7.png 1KB

999.css 2KB

p151 6-4 表格.html 912B

icon3.png 2KB

images

line.png 48KB

bg.png 8KB

c0f2300fbbb02ceb914e66f0272e96d.png 365B

icon.png 2KB

p161 6-9 登陆界面.html 386B

5-17音乐.html 770B

单元格的合并.html 574B

play1.png 935B

中国科学家.html 1KB

icon2.png 2KB

10月12日网页制作实操

2.jpg 22KB

设置内边距.html 374B

one.css 294B

div标签.html 375B

0.jpg 16KB

11.jpg 45KB

images

padding_in.png 185KB

pingmain.jpg 31KB

用户中心.html 391B

龙猫.html 1KB

设置边框属性.html 559B

lx.html 2KB

9月21日网页制作专业实操

1.多级标题.html 263B

2使用align的对齐方式.html 333B

3水平线标签.html 292B

5图像标签img之alt属性使用.html 229B

6.html 1KB

chenpi2.png 7KB

ok.png 220KB

OK KO.html 83B

ok.html 102B

images

banner.jpg 106KB

banner1.jpg 290KB

4用font标签设置文本样式.html 480B

9月28日网页制作实操

aa.html 23B

类选择器，文本段落.html 441B

css内嵌

内嵌式引入css样式表.html 461B

css定义+外链

1.txt 378B

1.html 377B

2.css 121B

0.jpg 48KB

使用CSS行内式修饰一级标题的字体大小和颜色.html 108B

<!Doctype html> <html><head> <meta charset="usf-8"> <title>数字变色</title> <link href="2.css" type="text/css" rel="stylesheet"/> </style> </head> <body> <strong class="blue">G</strong> <strong class="red">o</strong> <strong id="orange">o</strong> <strong class="blue">g</strong> <strong class="green">l</strong> <strong class="red">e</strong> </body> </html>

评论收藏

内容反馈