一 图片相关标签
Img标签和src属性: 在HTML里面,图像是由<img>标签定义的。<img>是空标签,意思是说,它只拥有属性,而没有结束标签。想要在页面上显示一个图像,需要使用src属性。“src”表示“源”的意思。“src”属性的值是所要显示图像的URL。
插入图像的语法:
URL指向图像存储的地址。网站“www.w3schools.com”子目录“images”中的图像“boat.gif”的URL如下: “http://www.w3schools.com/images/boat.gif”。当浏览器在文档中遇到img标签时,就放置一个图像。如果把img标签放在两个段落之间,就会先显示一个段落,然后是这个图像,最后是另外一个段落。
alt属性: alt属性用来给图像显示一个“交互文本”。alt属性的值是由用户定义的。
“alt”属性在浏览器装载图像失败的时候告诉用户所丢失的信息,此时,浏览器显示这个“交互文本”来代替图像。给页面上的图像都加上alt属性是一个好习惯,它有助于更好地显示信息,而且,对纯文本浏览器很有用。
基本注意点——有用的技巧: 如果一个HTML文档包含10个图像,那么为了正确显示这个页面,需要加载11个文件。加载图像是需要时间的,所以请谨慎使用图像。
看个例子吧:
显示如下:
图片的大小事可以自己设定的,一像素为单位,如果不设置大小,则会铺满屏幕。图片地址可以是绝对地址或者相对地址。
二 超链相关标签:
锚标签和href属性:
HTML使用锚标签(<a>)来创建一个连接到其他文件的链接。锚可以指向网络上的任何资源:HTML页面,图像,声音,影片等等。
创建一个锚的语法:
锚可以指向网络上的任何资源:HTML页面,图像,声音,影片等等。标签<a>被用来创建一个链接指向的锚,href属性用来指定连接到的地址,在锚的起始标签<a>和结束标签</a>中间的部分将被显示为超级链接。
这个连接到百度的主页。
target属性:
使用target属性,你可以定义从什么地方打开链接地址。下面这段代码打开一个新的浏览器窗口来打开链接:
锚标签和name属性name属性用来创建一个命名的锚。使用命名锚以后,可以让链接直接跳转到一个页面的某一章节,而不用用户打开那一页,再从上到下慢慢找。下面是命名锚的语法:
你可以为锚随意指定名字,只要你愿意。下面这行代码定义了一个命名锚并指向了一个网页:
基本注意点——有用的技巧:
尽量在子目录路径后面加一个左斜杠。假如你像下面这样写:href="http://www.w3schools.com/html",将会产生向服务器产生两个HTTP请求,因为服务器会在后面追加一个左斜杠,产生一个新的请求,就像这样:href="http://www.w3schools.com/html/"。命名锚通常用来在大型文档的开头创建章节表。这个页面的每个章节被加上一个命名锚,到这些锚的链接被放在页面的顶端。如果浏览器无法找到指定的命名锚,它将转到这个页面的顶部,而不显示任何错误提示。
现在来看个完整的示例吧:
图片如下:
暂时就这么多了,多试试自己写的。
分享到:
相关推荐
5. **标题层级**:使用`<h1>`至`<h6>`定义不同级别的标题,`<h1>`是最大标题,`<h6>`是最小标题。 6. **段落与换行**:`<p>`标签用于创建段落,而` `标签则用于在不开始新段落的情况下强制换行。 7. **HTML注释...
12. HTML5新特性:HTML5引入了新的元素,如`<header>`、`<footer>`、`<section>`、`<article>`,以更好地表达网页结构;`<canvas>`和`<svg>`支持图形绘制和矢量图;`<audio>`和`<video>`支持多媒体内容。 在学习...
【标题】"从头开始学习Python编程语言课程100节课44小时视频代码项目和聊天组前端后端基础知识AI测试.zip" 提供了一个全面的Python学习资源,涵盖了从入门到进阶的完整过程,共计100节课,时长44小时。这表明课程...
例如,要加载 Dojo 1.5,可以在 HTML 页面中插入如下代码: ```html <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js"></script> ``` 此外,为了确保在 CDN 失效时仍能正常运行,可以...
在这个从头开始的学习过程中,我们将系统化地探索如何利用Python 3.6构建高效的网络爬虫,以获取和处理互联网上的数据。 首先,你需要了解Python的基础知识,包括变量、数据类型(如字符串、列表、元组、字典)、...
通过结合`requests`库,你可以先获取网页内容,再使用BeautifulSoup解析其中的数据。 对于更复杂的爬虫项目,Scrapy框架是不二之选。Scrapy是一个强大的爬虫框架,它提供了一整套解决方案,包括请求调度、中间件、...
《她从头开始学习HTML,CSS,JavaScript》 在当今数字化的世界中,掌握网页开发的基础技能,如HTML、CSS和JavaScript,对个人的职业发展至关重要。本文将深入探讨这些核心技术,帮助初学者理解它们的重要性,以及...
《The Adventures Of SC:从头开始制作HTML5游戏》是一份深入浅出的教程,旨在引导初学者和有经验的开发者逐步构建一个完整的HTML5游戏。HTML5是现代网页开发的关键技术之一,它极大地扩展了网页的功能性,尤其是...
5. **版本控制**:学习使用Git进行版本控制,理解分支和合并的概念,这对于协作开发至关重要。 6. **项目实践**:通过实际的网页设计项目,将理论知识应用于实践中,提高问题解决和调试技能。 7. **代码规范**:理解...
HTML5响应式模板是现代网页设计中的重要工具,它们能够自动适应不同的设备屏幕尺寸,提供一致的用户体验,无论用户是在桌面电脑、平板还是手机上浏览。以下是对这些模板及其相关技术的详细解释: 1. **HTML5**:...
学习网络回购从头开始学习网络
【标题】:“网页模板——基于HTML5实现的坦克大战网页小游戏源码.zip”指的是一个包含HTML5技术实现的坦克大战游戏的源代码文件。这个压缩包可能是为了教学、学习或娱乐目的而创建的,它提供了从头构建此类游戏的...
在《从头开始学习Webpack 5》课程中,我们将深入理解Webpack的工作原理和核心概念,以便更好地优化前端项目的构建流程。Webpack 5 的发布引入了一些重要的更新和改进,包括对内存和性能的优化,以及对新特性的支持。...
5. **MVC(Model-View-Controller)模式**:解释在JSP开发中如何应用MVC设计模式,以实现良好的代码结构和可维护性。 6. **JSP与JavaBean**:演示如何使用JavaBean作为业务逻辑组件,以及在JSP中如何调用和管理Bean...
这个标题暗示了我们讨论的主题是关于HTML5页面模板的源代码。HTML5是现代网页开发的基石,它提供了丰富的功能和元素,使得开发者能够创建出更加交互式、动态且响应式的网页。"很不错的例子"意味着这些源码不仅可用,...
从头开始学习 Python该存储库是一个源代码存储库,用于在线学习网站进行学习。必要的东西要从源代码生成 HTML 页面,您需要以下内容: Python3建造执行以下命令生成 HTML。 $ pip install -r requirements.txt$ ...
【标题】中的“非洲儿童教育类网站模板”指的是一个专门设计用于儿童教育的网页模板,它基于HTML5技术,能够为创建一个互动性、趣味性强的在线教育平台提供基础。HTML5是现代网页开发的标准语言,它包含了丰富的媒体...
### 教你自己在24小时内开发HTML5移动应用 #### I. 构建网页与应用程序:开放网络标准 - **改善移动Web应用开发**:HTML5作为一种新兴的标准,提供了诸多新特性来提升移动Web应用的性能和用户体验。本书将介绍如何...
【标题】"基于JQuery和html5的拼图游戏类库"揭示了这个项目的核心技术栈,即JavaScript的两个重要库——JQuery和HTML5的新特性。JQuery是广泛使用的JavaScript库,它简化了DOM操作、事件处理和AJAX交互等任务。而...