精通HTML5与CSS3基础构建

需积分: 9 65 浏览量更新于2024-07-27 收藏 5.95MB PDF 举报

"Foundation HTML5 with CSS3 是一本关于网页开发的基础教程，涵盖了从HTML和CSS的基本概念到构建复杂网页的多个方面。" 在本教程中，作者首先介绍了互联网和万维网的基本知识，帮助读者理解网络环境的背景。HTML（超文本标记语言）是网页内容的主要结构语言，而CSS（层叠样式表）则用于定义这些内容的视觉样式和布局。在第一章"Getting Started"中，作者旨在为初学者建立一个基础，让他们对这两个关键概念有初步的认识。接下来的章节逐步深入，详细讲解了以下知识点： 1. **HTML和CSS基础知识**（Chapter 2）：这里会介绍HTML标签、属性以及如何组织网页内容，同时也会涉及CSS的基础语法，如选择器、属性和值，以及如何应用样式。 2. **文档结构**（Chapter 3）：这部分可能包括了DOCTYPE声明、HTML元素的层次关系，以及元数据（metadata）的使用，如字符集设置和viewport元标签。 3. **构建内容**（Chapter 4）：涵盖各种HTML元素，如文本、图像、链接、列表、段落等，以及如何有效地创建和组织网页内容。 4. **嵌入媒体**（Chapter 5）：讨论如何在网页中插入音频、视频内容，以及如何使用HTML5的多媒体元素进行处理。 5. **链接网页**（Chapter 6）：解释了URL、绝对链接与相对链接的区别，以及如何创建内部链接、外部链接和锚点链接。 6. **表格的构建**（Chapter 7）：教授如何使用HTML创建和格式化表格，包括行、列、合并单元格等。 7. **表单和应用程序的组装**（Chapter 8）：介绍表单元素（如输入框、按钮、复选框等）、表单验证和如何处理用户提交的数据。 8. **CSS页面布局**（Chapter 9）：涵盖了CSS布局技术，如盒模型、浮动、定位，以及后来出现的Flexbox和Grid布局系统。 9. **整合所有内容**（Chapter 10）：在这一章中，作者将引导读者如何将前面学到的所有知识结合起来，创建一个完整的、功能丰富的网页。最后，书后附有索引，方便读者查找特定主题。这本书适合对网页设计感兴趣的新手，也适合有一定经验但希望巩固HTML5和CSS3基础知识的开发者。通过学习，读者将能够熟练地创建和控制网页的外观和行为，从而在网页设计领域打下坚实的基础。

Getting Started

Figure 1-2. The W3C Markup Validation Service

The W3C validator can automatically analyze your markup and display any errors it encounters so you can

correct them. It will also display validation warnings, which are simply cautions about issues you might

want to address but are not quite as severe as errors; warnings can be ignored if you have good reason to

do so, but errors are flaws that really must be fixed. When no errors are found, you’ll see a joyful banner

declaring that your document is valid. A document that is valid and correctly assembled according to the

rules of the language is said to be well-formed. Other validation tools are also available—both online and

offline—that can help you check your documents.

CSS also needs to be authored in accordance with the specifications, and the W3C offers a similar CSS

validation service (http://jigsaw.w3.org/css-validator/) to check your CSS files for problems.

Most web browsers are still able to interpret and render invalid documents, but only because they’ve been

designed to compensate for minor errors. Valid, well-formed documents are much more stable, and you

won’t have to depend on a browser’s built-in error handling to display them correctly.

Chapter 1

Hosting Your Web Site

You can save all of your work locally on your own computer, but when it’s time to make it available to the

World Wide Web, you need to move those files to a web server. You have a few hosting options if you’re

building your own website:

 Using web space provided by your ISP: An Internet service provider (ISP) is the company that

connects you to the Internet. Many service providers offer a limited amount of web space where

you can host your own site. Ask your ISP whether web space is included with your service

contract and how you can use it.

 Using free web space: Many companies provide free web hosting, though “free” is a relative term

because free web hosts are usually supplemented by advertising. If you’re not bothered by such

ads appearing on your website, free hosting may be a quick solution to getting your files online.

 Paying for web hosting: Perhaps the best option is to purchase service from a company that

specializes in hosting websites. Many offer hosting packages for as little as $10 (US) per month

and include more robust features than free hosting or ISP hosting provides (such as e-mail

service, server-side scripting, and databases). Research your options, and choose a host that

can meet your needs.

If you opt for paid web hosting, you’ll also need to purchase and register a unique domain name to be your

site’s address on the Web. Some hosting companies offer domain registration as an included service (and

some domain registrars also offer hosting services), but securing a domain and securing a host are usually

two separate processes.

We won’t go into all the particulars of registering a domain and getting your site online with a web host.

After all, this is still the first chapter, and numerous resources online can provide more information. To

learn more about hosting your websites when the time comes, just visit your favorite search engine and

have a look around for information about “web hosting basics” or some similar phrase. One good place to

start is the Wikipedia entry about web hosting service (http://en.wikipedia.org/wiki/Web_hosting),

which offers a fairly detailed introduction to set you on your way.

Introducing the URL

Every file or document available on the Web resides at a unique address called a Uniform Resource

Locator (URL). The term Uniform Resource Identifier (URI) is sometimes used interchangeably with URL,

though URI is a more general term; a URL is a type of URI. We’ll be using the term URL in this book to

discuss addressed file locations. It’s this address that allows a web-connected device to locate a specific

file on a specific server in order to download and display it to the user (or employ it for some other

purpose; not all files on the Web are meant to be displayed).

Getting Started

The Components of a URL

A web URL follows a standard form that can be broken down into a few key parts, diagrammed in Figure

1-3. Each segment of the URL communicates specific information to both the client and the server.

http://www.example.com/examples/example.html

Protocol Hostname Path

Name Extension

File

Prefix Domain

Figure 1-3. The components of a URL

The protocol indicates one of a few different sets of rules that dictate the movement of data over the

Internet. The Web uses HyperText Transfer Protocol (HTTP), the standard protocol used for transmitting

hypertext-encoded data from one computer to another. The protocol is separated from the rest of the URL

by a colon and two forward slashes (://).

A hostname is the name of the site from which the browser will retrieve the file. The web server’s true

address is a unique numeric Internet Protocol (IP) address, and every computer connected to the Internet

has one. IP addresses look something like “66.211.109.45,” which isn’t very easy on the eyes and is

certainly a challenge to remember. A domain name is a more memorable alias that directs Internet traffic

to an IP address. Many web hostnames feature a domain prefix, further naming the particular server being

accessed (especially when there are multiple servers within a single domain), though that prefix is

frequently optional. A prefix can be almost any short text label, but “www” is traditional. It’s possible for

another entire website to exist separately within a domain under a different prefix, known as a subdomain.

A hostname will also feature a domain suffix (sometimes called an extension) to indicate the domain’s

category, such as “.com” for a U.S. commercial domain, “.edu” for a U.S. educational institution, or “.co.uk”

for a commercial website in the United Kingdom. Every country also has its own domain extension, and

you’ll often see URLs that indicate a country of origin but not any particular category.

The path specifies the directory on the web server that holds the requested document, just as you save

files in different virtual folders on your own computer. Files on a web server may be stored in

subdirectories—folders within folders—and each directory in the path is separated by a forward slash (/).

This path is the route a client will follow to reach the ultimate destination file. The top-level directory of a

website (the one that contains all other files and directories) is called the site root directory and doesn’t

appear in the URL.

The specific file to retrieve is identified by its file name and extension. You can give your files just about

any name you want, and a file extension indicates what type of file it is. An HTML (or XHTML) document

will have an extension of .html or .htm (the shorter version is used on some servers that support only

three-letter file extensions). CSS files use the .css extension, JavaScript files use .js, and so forth. Web

Chapter 1

servers are configured to recognize these extensions and handle the files appropriately, processing

different types of files in different ways.

You won’t see a file name and extension in every URL you encounter. Most web servers are configured to

automatically locate a specially named file when a directory is requested without a specified file name.

This could be the file called index.html, default.html, or some other name, depending on the way the

server has been set up. Indeed, most of the various parts of the URL may be optional depending on the

particular server configuration.

The URL is the instrument that allows you to build links to other parts of the Web, including other parts of

your own site. You’ll use URLs extensively in the HTML and CSS you author, which is why we’ve spent so

much time exploring them in this first chapter.

Absolute and Relative URLs

A URL can take either of two forms when it points to a resource elsewhere within the same site. An

absolute URL is one that includes the full string, including the protocol and hostname, leaving no question

as to where that resource is found on the Web. You’ll use an absolute URL when you link to a site or file

outside your own site’s domain, though internal URLs can also be absolute.

A relative URL is one that points to a resource within the same site by referencing only the path and/or file,

omitting the protocol and hostname because those can be safely assumed. It might look something like

this:

examples/chapter1/example.html

If the destination file is kept within the same directory as the file where the URL occurs, the path can be

assumed as well so only the file name and extension are required, like so:

example.html

If the destination is in a directory above the source file, you can indicate that relative path with two dots

and a slash (../), instructing the browser to go up one level to find the resource. Each occurrence of ../

indicates one up-level directive, so a URL pointing two directories upwards might look like this:

../../example.html

Almost all web servers are configured to interpret a leading slash in a relative URL as the site root

directory, so URLs can be “site root relative,” showing the full path from the site root down:

/examples/chapter1/example.html

Lastly, if the destination is a directory rather than a specific file, only the path is needed:

/examples/chapter1/

剩余423页未读，继续阅读

tsusiz001

粉丝: 0
资源: 1

精通HTML5与CSS3基础构建

HTML5 & CSS3

Beginning HTML5 and CSS3

HTML5与CSS3基础教程

你可以帮我编代码吗？用Foundation，Bootstrap5，css，html5，js，python上传视频

你可以帮我编代码吗？用Foundation，Bootstrap5，css，html5，js，python上传视频，示例代码

html➕css➕js框架

2023年htmlcss面试题

你可以帮我编代码吗？ 1帮我做一个类似于b站的视频网站2用Django，python，html，css，Java，Bootstrap，Foundation3可以实现上传视频看视频4看视频

你可以帮我编代码吗？1用Django，python，html，css，Java，Bootstrap，Foundation2实现视频网页3可以实现上传视频，看视频，能登陆注册，有搜索引擎，可以实现个人页面4想要示例代码

使用 HTML css JavaScript 设计华为官网的内容

最新资源