菜鸟教程-HTML小白之实例练习-0804

已于 2022-08-04 15:58:00 修改
阅读量187 收藏
点赞数
分类专栏： 前端 文章标签： html
于 2022-08-04 15:29:44 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lily_25/article/details/126159007
版权

实例1：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
	
<body>

<h4>创建电子邮件</h4>
<p>创建电子邮件链接:
<a  href="mailto:someone@example.com?Subject=Hello%20again" target="_top">发送邮件</a>	
</p>
	
<p>创建更加复杂的电子邮件链接:
<a href="mailto:someone@example.com?cc=john@example.com&bcc=someoneelse@example.com&subject=Summer%20Party&body=You%20are%20invited%20to%20a%20big%20summer%20party!" target="_top" rel="noopener noreferer">
发送邮件</a>
</p>
<hr /> 

<h4 style="text-align:left">带有标题的表格</h4>
<!-- border属性决定表格边框，border="0"则为无边框-->
<table border="1">
	<!--caption标签：定义表格标题-->
	<caption>Monthly saving</caption>
	<tr>
		<!-- th标签:定义表格的表头-->
		<th>Month</th>
		<th>Saving</th>
	</tr>
	<tr>
		<td>Jan</td>
		<td>$100</td>
	</tr>
	<tr>
		<td>Feb</td>
		<td>$50</td>
	</tr>
</table>
<hr />
	
<h4>单元格跨两列：</h4>
<table border="1">
<tr>
	<th>Name</th>
	<!-- colspan属性：跨列，合并后的单元格归属原则都是左上原则，即从上到下从左到右算-->
	<th colspan="2">Tel</th>
</tr>
<tr>
	<td>Bill</td>
	<td>555 77 854</td>
	<td>555 77 855</td>
</tr>
</table>	
	
<h4>单元格跨两行</h4>
<table border="1">			   
<tr>
	<th>Fisrt Name:</th>
	<td>Bill</td>
</tr>
<tr>
	<!-- rowspan属性：跨行，合并后的单元格归属原则都是左上原则，即从上到下从左到右算-->
	<th rowspan="2">Tel:</th>
	<td>555 77 854</td>
</tr>
<tr>
	<td>555 77 855</td>
</tr>
</table>
<hr />

<h4>表格内的标签</h4>
<table border="1">
<tr>
  <td>
   <p>这是一个段落</p>
   <p>这是另一个段落</p>
  </td>
  <td>这个单元格包含一个表格:
   <table border="1">
   <tr>
     <td>A</td>
     <td>B</td>
   </tr>
   <tr>
     <td>C</td>
     <td>D</td>
   </tr>
   </table>
  </td>
</tr>
<tr>
  <td>这个单元格包含一个列表
   <ul>
    <li>apples</li>
    <li>bananas</li>
    <li>pineapples</li>
   </ul>
  </td>
  <td>HELLO</td>
</tr>
</table>
<hr />
	
<h4>单元格边距</h4>
<!--使用cellpadding创建单元格内容与边框之间的空白-->
<p><i>使用cellpadding创建单元格内容与边框之间的空白</i></p>
<table border="1" cellpadding="10">
<tr>
	<td>First</td>
	<td>Row</td>
</tr>
<tr>
	<td>Second</td>
	<td>Row</td>
</tr>
</table>
<hr />
	
<h4>单元格间距</h4>
<!-- 使用cellspacing 增加单元格之间的距离-->
<p><i>table标签未指定cellspacing->没有单元格间距</i></p>
<table border="1">
<tr>
	<td>First</td>
	<td>Row</td>
</tr>
<tr>
	<td>Second</td>
	<td>Row</td>
</tr>		
</table>
<br />
<p><i>table标签cellspacing="0"</i></p>
<table border="1" cellspacing="0">
<tr>
	<td>First</td>
	<td>Row</td>
</tr>
<tr>
	<td>Second</td>
	<td>Row</td>
</tr>		
</table>
<br />
<p><i>table标签cellspacing="10"</i></p>
<table border="1" cellspacing="10">
<tr>
	<td>First</td>
	<td>Row</td>
</tr>
<tr>
	<td>Second</td>
	<td>Row</td>
</tr>		
</table>
	
</body>
</html>

Lily_25
关注
专栏目录
java基础教程----精华版
09-22
以上只是Java基础知识的一部分，实际的Java基础教程会更深入地讲解每个概念，并配有实例来帮助理解。这份"java基础教程----精华版"应该涵盖了这些主题，并且可能还有更多的实践指导和示例代码，对于学习和巩固Java...
菜鸟教程-HTML小白之实例练习-0728
Lily_25的博客
07-29 186
尝试用这种方式记录学习内容，加油~
《HTML 链接》
yexiangCSDN的专栏
06-20 465
HTML链接 HTML 使用超级链接与网络上的另一个文档相连。几乎可以在所有的网页中找到链接。点击链接可以从一张页面跳转到另一张页面。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> <...
初学HTML新手练习题“精选讲解”
小华的博客
09-19 714
文章目录 前言 一、HTML是什么？ 二、使用步骤 1.基础标签 2.使用方法 总结 前言 本文章仅限于本人学习。 提示：以下是本篇文章正文内容，下面案例可供参考 一、HTML是什么？ HTML 指的是超文本标记语言 (HyperTextMarkupLanguage)。是制作超级文本文档的简单标记语言，可以从一个平台移植到另一个平台，通常用于制作网页。包括格式标记和超级文本链的嵌入代码。 二、使用步骤 1.以下图片为讲解学习内容以及标签应用 2....
HTTP Referer 教程
qq_42992919的博客
07-09 1902
现实生活中，购买服务或加入会员的时候，往往要求提供信息：“你从哪里知道了我们？” 这叫做引荐人（referrer），谁引荐了你？对于公司来说，这是很有用的信息。 互联网也是一样，你不会无缘无故访问一个网页，总是有人告诉你，可以去那里看看。服务器也想知道，你的"引荐人"是谁？ HTTP 协议在请求（request）的头信息里面，设计了一个Referer字段，给出"引荐网页"的 URL。 这个字段...
HTML5基础入门
qq_52403971的博客
08-31 338
HTML5——day01(基础入门) ​ HTML5——day01 前端要素之二:HTML5+CSS3. HTML5 ：超文本标记语言。超文本即是 一种规范一种标准，通过标记符号来标记要显示的网页中的各个部分。 HTML5是网页的内容载体，是网页制作者放在页面上让用户浏览的信息界面， CSS3是HTML5的网页基础上给网页一种优化，改变网页基础外表进行浓妆淡抹。 HTML5的基本结构： <！DOCTYPE HTML></！DOCTYPE> 。标准的网页声明，表示浏览器本身的解析标准
avr单片机-教程-实例-附电路图.zip
07-25
avr单片机_教程_实例_附电路图.zip
labview与NI-ELVIS实验教程实例.zip
03-02
labview与NI-ELVIS实验教程实例
Autocad-勾月教程PPT+典型100个实例+word练习题.rar
04-19
本教程资源“Autocad-勾月教程PPT+典型100个实例+word练习题”旨在帮助用户深入理解和掌握AutoCAD的基本操作以及实际应用技巧。 1. **AutoCAD基础操作** - 图形界面：了解AutoCAD的工作界面，包括菜单栏、工具栏、...
vertx应用开发实例教程-完整版
05-21
本资源为 Vert.x应用开发实例教程（吕海东，张坤 著）全高清完整版pdf 。 《Vert.x应用开发实例教程》全面采用案例驱动，主要知识的讲解都辅助以实际案例应用编程，便于读者的理解和自主学习和运用。 　知识讲解通俗...
mailto用法详解
热门推荐
Jack 架构师之路
07-03 4万+
引言    小编最近修改平控件的一个问题，就是当程序弹出错误页的时候点击发邮件提示，然后调用本地已经安装的邮 件客户端（像outlook等）来完成邮件发送的功能，错误页是我们平台组自己写的一个控件，所以代码是比较复杂 的，但是它并没有和后台交互，所以这个功能应该是靠HTM和angularJS来实现的，当时小编是一脸懵逼的样子，完全 不知道这个东西怎么玩啊，最
mailto 参数讲解
赠人玫瑰,手留余香.
02-11 5777
http://www.cnblogs.com/joer/archive/2010/09/28/1841235.html Mailto能让访问者便捷向网站管理者发送电子邮件。我们还可以利用mailto做许多其它事情。Mailto甚至还能自动在电子邮件中填入“抄送”和“密件抄送”者，或自动填写主题行。 　　1）基本的 mailto 　　单击这里给我发电子邮件 　　当浏览者点击这个链接时，浏
菜鸟教程-HTML小白之实例练习-0729
Lily_25的博客
07-29 370
尝试用这种方式记录学习内容，加油~
HTML 比较常用的标签（3）
小芋儿的博客
08-22 205
比较常用的标签<img>标签<map>标签<a>标签<iframe>标签<noscript>标签 <img>标签 <img src="smiley.gif" alt="Smiley face" style="float:left" width="32" height="32"> <map>标签 <!--图片映射--> <img src="planets.gif" width="145" he
DevExpress中文教程 - 如何使用AI模型检查HTML编辑中的语法？
需要界面开发、IDE工具研发中文教程资料的小伙伴，记得私信我~
11-04 755
本文将主要展示如何将AI相关功能添加到HTML编辑控件并调整其UI获得最佳用户体验，欢迎下载最新版组件体验！
一七五、HTML 不同类型的事件及其说明和示例
梅某某
11-07 726
HTML 事件处理程序是通过 JavaScript 来捕获和响应不同的用户操作、系统事件或浏览器事件。下面是不同类型的事件及其说明和示例。
HTML和CSS 介绍
Zhao_0912的博客
11-04 1047
HTML 是一种用于创建网页的标准标记语言。它由一系列的元素组成，这些元素通过标签表示，用于描述网页的结构和内容。CSS 是一种用于描述 HTML 文档样式的样式表语言。它用于控制网页的布局、颜色、字体、间距等视觉效果。HTML：用于定义网页的结构和内容，通过标签组织信息，提供多媒体支持和用户交互功能。CSS：用于控制网页的样式和布局，通过丰富的样式属性和选择器，实现美观的视觉效果和灵活的布局，支持响应式设计和交互效果。结合 HTML 和 CSS，开发者可以创建出结构清晰、视觉美观、用户体验良好的网页。
前端八股文(一)HTML 持续更新中。。。
DogEgg_001的博客
11-06 542
src：用于js脚本，img、iframe、script等标签加载时会阻塞主线程，将资源内容嵌入到当前标签所在的位置，将其指向的资源下载应用到文档内href：用于链接a、link等标签href指向外部资源所在的位置，和当前元素位置建立链接，将其下载的时候不会阻止其他资源的加载解析。
常见前端代码分析面试题Javascript|html
最新发布
警警的博客
11-08 341
html\CSS\Javascript
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值