整合SpringMVC之歡迎頁面與自定義Favicon

.Spring Boot設(shè)置歡迎頁面

1.默認(rèn)歡迎頁的源碼

在Spring Boot中，默認(rèn)的歡迎界面是index.html，那為什么這樣呢？我們可以看看源碼是怎么定義的。

public class WebMvcAutoConfiguration {
   private Optional<Resource> getWelcomePage() {
       String[] locations = getResourceLocations(this.resourceProperties.getStaticLocations());
       return Arrays.stream(locations).map(this::getIndexHtml).filter(this::isReadable).findFirst();
   }

    private Resource getIndexHtml(String location) {
        return this.resourceLoader.getResource(location + "index.html");
    }
}

從源碼中我們可以看到，歡迎頁的靜態(tài)資源文件默認(rèn)就是index.html頁面，并且只要該頁面存放在resources目錄下的默認(rèn)路徑中，就會(huì)被"/**"映射。

classpath:/META-INF/resources/ 
classpath:/resources/
classpath:/static/ 
classpath:/public/
/：當(dāng)前項(xiàng)目的根路徑

也就是只要index.html頁面在以上幾個(gè)目錄內(nèi)，就會(huì)自動(dòng)被Spring Boot探測(cè)到。

2.實(shí)驗(yàn)驗(yàn)證

2.1 創(chuàng)建web項(xiàng)目(略)

目錄結(jié)構(gòu)如下，在該項(xiàng)目中，我們?cè)趓esources目錄下，創(chuàng)建4個(gè)子文件夾，具體參考上一章節(jié)。然后在每個(gè)子文件夾中，都存放一個(gè)index.html文件，但是文件內(nèi)容略有不同，每個(gè)文件都有自己的編號(hào)。

每個(gè)index.html文件內(nèi)容的編號(hào)不同，以此類推！

2.2 啟動(dòng)項(xiàng)目測(cè)試

我們啟動(dòng)web項(xiàng)目，輸入地址http://localhost:8080會(huì)發(fā)現(xiàn)，默認(rèn)加載的是META-INF/resources目錄下的index.html文件，為什么呢？這與靜態(tài)資源文件夾的優(yōu)先級(jí)有關(guān)系哦，我們上一章節(jié)已經(jīng)講過了

二.自定義歡迎頁面

但在實(shí)際開發(fā)中，我們有時(shí)候就希望先訪問登錄界面，然后登錄成功后再跳到主頁面，那此時(shí)如何將登錄頁面作為歡迎頁面呢？

這個(gè)可以有兩種實(shí)現(xiàn)方式。

視圖控制器配置方式；
Controller直接實(shí)現(xiàn)方式；

1.視圖控制器配置方式

1.1 創(chuàng)建配置類

我們可以在上面的web項(xiàng)目中，創(chuàng)建一個(gè)WebMvcConfigurerAdapter類。

package com.yyg.boot.config;

import org.springframework.context.annotation.Configuration;
import org.springframework.core.Ordered;
import org.springframework.web.servlet.config.annotation.ViewControllerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurationSupport;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

/**
 * @Description Description
 * @Author 一一哥Sun
 * @Date Created in 2020/3/21
 */
@Configuration
public class DefaultViewConfig extends WebMvcConfigurerAdapter {

    @Override
    public void addViewControllers(ViewControllerRegistry registry) {
        //這里的"/"是訪問路徑，"forward:home.html"是請(qǐng)求轉(zhuǎn)發(fā)到的頁面名稱
        registry.addViewController("/").setViewName("forward:home.html");
        //設(shè)置優(yōu)先級(jí)
        registry.setOrder(Ordered.HIGHEST_PRECEDENCE);
        super.addViewControllers(registry);
    }

}

1.2 創(chuàng)建home.html頁面

我們?cè)趕tatic目錄下創(chuàng)建一個(gè)home.html頁面。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Home</title>
</head>
<body>
    <h1>一一哥的Home頁面...</h1>
</body>
</html>

1.3 運(yùn)行測(cè)試

接著我們運(yùn)行程序，輸入地址：http://localhost:8080就可以看到如下歡迎界面。

2. Controller直接實(shí)現(xiàn)方式

我們?cè)谏弦粋€(gè)例子的基礎(chǔ)之上，創(chuàng)建一個(gè)Controller類。

注意：

把上一個(gè)案例中DefaultViewConfig配置類的@Configure注解去掉，避免影響到本次實(shí)驗(yàn)。

2.1 項(xiàng)目結(jié)構(gòu)：

2.2 創(chuàng)建Controller

package com.yyg.boot.web;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

/**
 * @Description Description
 * @Author 一一哥Sun
 * @Date Created in 2020/3/21
 */
@Controller
public class WelcomeController {

    @RequestMapping("/")
    public String view() {
        return "forward:home.html";
    }

}

2.3 運(yùn)行測(cè)試

接著我們運(yùn)行程序，輸入地址：http://localhost:8080就可以看到如下歡迎界面。

三.結(jié)合Thymeleaf模板實(shí)現(xiàn)歡迎頁面

我們可以結(jié)合Thymeleaf模板，來實(shí)現(xiàn)歡迎頁面。

1.添加依賴包

在該web項(xiàng)目的pom.xml文件中添加依賴包。

<dependencies>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>
</dependencies>

2.配置模板路徑

創(chuàng)建application.properties文件，添加如下配置，其實(shí)默認(rèn)也是這個(gè)配置。

spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html

3.創(chuàng)建login.html頁面

創(chuàng)建login.html存放到/templates/目錄下。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Login</title>
</head>
<body>
    <h1>一一哥的登錄頁面...</h1>
</body>
</html>

4.創(chuàng)建Controller接口

package com.yyg.boot.web;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

/**
 * @Description Description
 * @Author 一一哥Sun
 * @Date Created in 2020/3/21
 */
@Controller
public class WelcomeController {

//    @RequestMapping("/")
//    public String view() {
//        return "forward:home.html";
//    }

    @RequestMapping("/")
    public String login() {
        return "login";
    }
}

5.運(yùn)行測(cè)試

輸入地址，http://localhost:8080即可看到歡迎界面。

四.設(shè)置網(wǎng)站圖標(biāo)Favicon

1.Favicon簡(jiǎn)介

很多時(shí)候，企業(yè)網(wǎng)站一般都會(huì)有一個(gè)對(duì)應(yīng)的網(wǎng)站圖標(biāo)(Favicon)，在瀏覽器訪問網(wǎng)站時(shí)，對(duì)應(yīng)的瀏覽器標(biāo)簽上會(huì)出現(xiàn)對(duì)應(yīng)的圖標(biāo)。例如csdn網(wǎng)站上的小圖標(biāo)。

2.Favicon源碼分析

我們可以看看Spring中關(guān)于Favicon的源碼。

@Configuration
@ConditionalOnProperty(value = {"spring.mvc.favicon.enabled"},matchIfMissing= true)
public static class FaviconConfiguration implements ResourceLoaderAware {
    private final ResourceProperties resourceProperties;
    private ResourceLoader resourceLoader;

    public FaviconConfiguration(ResourceProperties resourceProperties) {
        this.resourceProperties = resourceProperties;
    }

    public void
    setResourceLoader(ResourceLoader resourceLoader) {
        this.resourceLoader = resourceLoader;
    }

    @Bean
    public SimpleUrlHandlerMapping faviconHandlerMapping() {
        SimpleUrlHandlerMapping mapping = new SimpleUrlHandlerMapping();
        mapping.setOrder(-2147483647);
        mapping.setUrlMap(Collections.singletonMap("**/favicon.ico", this.faviconRequestHandler()));
        return mapping;
    }

    @Bean
    public ResourceHttpRequestHandler faviconRequestHandler() {
        ResourceHttpRequestHandler
        requestHandler = new ResourceHttpRequestHandler();
        requestHandler.setLocations(this.resolveFaviconLocations());
        return requestHandler;
    }

    private List<Resource> resolveFaviconLocations() {
    String[] staticLocations = WebMvcAutoConfiguration.WebMvcAutoConfigurationAdapter.getResourceLocations(this.resourceProperties.getStaticLocations());
    List<Resource> locations = new ArrayList(staticLocations.length + 1);
    Stream var10000 = Arrays.stream(staticLocations);
    ResourceLoader var10001 = this.resourceLoader;
    var10001.getClass();
    var10000.map(var10001::getResource).forEach(locations::add);
    locations.add(new ClassPathResource("/"));
    return
    Collections.unmodifiableList(locations);
   }
}

3.SpringBoot 1.x與2.x版本區(qū)別

在SpringBoot 1.x版本中對(duì)Favicon進(jìn)行了默認(rèn)支持，并且可以通過如下配置進(jìn)行關(guān)閉操作:

spring.mvc.favicon.enabled=false ## 關(guān)閉

默認(rèn)的Favicon圖標(biāo)效果：

但到了SpringBoot2.x版本后，在Spring Boot項(xiàng)目的issues中提出，如果用戶不進(jìn)行自定義的Favicon的設(shè)置，而Spring Boot項(xiàng)目會(huì)提供默認(rèn)的圖標(biāo)，而如果提供默認(rèn)的Favicon圖標(biāo)，則可能會(huì)導(dǎo)致泄露網(wǎng)站的開發(fā)框架這樣的信息。

因此，在Spring Boot2.2.x中，將默認(rèn)的favicon.ico移除，同時(shí)也不再提供上述application.properties中的屬性配置。更多詳細(xì)信息可查看對(duì)應(yīng)的issues：https://github.com/spring-pr

4.SpringBoot2.x項(xiàng)目中添加Favicon

在2.x以前的版本，直接將你需要的favicon.ico文件存放在static下面就可以。

但到了2.2.X以后的版本，去掉了默認(rèn)的自動(dòng)配置，需要我們手動(dòng)在每一個(gè)頁面添加自己網(wǎng)站的Favicon圖標(biāo)。

我們可以在static目錄下創(chuàng)建一個(gè)images目錄，里面存放自己的Favicon.ico圖標(biāo)。

4.1 html頁面中添加

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Login</title>
    <link rel="icon" href="images/Favicon.ico" type="image/x-icon"/>
</head>
<body>
<h1>一一哥的登錄頁面...</h1>
</body>
</html>

4.2 Thymeleaf頁面中添加

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title>Hello Favicon</title>
<link rel="icon" th:href="@{/favicon.ico}" type="image/x-icon"/>
</head>
<body>
<h1>Hello 一一哥!</h1>
</body>
</html>

5.重啟項(xiàng)目測(cè)試

我們重新訪問頁面，可以看到Favicon圖標(biāo)已經(jīng)換成了我自己的圖標(biāo)。

章來源：freecodecamp網(wǎng)址：https://chinese.freecodecamp.org/

HTML 是一種標(biāo)記語言，使用特殊的語法或標(biāo)記來向?yàn)g覽器描述網(wǎng)頁的結(jié)構(gòu)。HTML 元素由開始和結(jié)束標(biāo)簽構(gòu)成，標(biāo)簽之間是文本內(nèi)容。不同的標(biāo)簽可以讓文本內(nèi)容以標(biāo)題、段落、列表等形式展現(xiàn)。

在這個(gè)課程中，你將通過編寫一個(gè)展示貓咪圖片的應(yīng)用，學(xué)習(xí)最常見的 HTML 元素——它們可以用來構(gòu)成任何網(wǎng)頁。

向 HTML 元素問好通過

歡迎訪問 freeCodeCamp 的 HTML 編程挑戰(zhàn)。這些挑戰(zhàn)將會(huì)幫助你逐步掌握 Web 開發(fā)。

首先，我們采用 HTML 制作一個(gè)簡(jiǎn)單的網(wǎng)頁。你可以直接在網(wǎng)頁內(nèi)置的代碼編輯器中編輯代碼。

你看到編輯器中的 <h1>Hello</h1> 了嗎？那是一個(gè) HTML 元素。

大部分 HTML 元素都有一個(gè)開始標(biāo)簽和一個(gè)結(jié)束標(biāo)簽。

開始標(biāo)簽像這樣：

<h1>

結(jié)束標(biāo)簽像這樣：

</h1>

開始標(biāo)簽和結(jié)束標(biāo)簽的唯一區(qū)別就是結(jié)束標(biāo)簽多了一個(gè)斜杠。

每個(gè)挑戰(zhàn)都有測(cè)試，任何時(shí)候你點(diǎn)擊“運(yùn)行測(cè)試”按鈕，就可以運(yùn)行測(cè)試。如果代碼通過測(cè)試，將會(huì)彈出一個(gè)窗口，你就可以進(jìn)入下一個(gè)挑戰(zhàn)。

要通過這個(gè)挑戰(zhàn)的測(cè)試，需要修改 h1 元素的文本為 Hello World。

具體要求如下：

h1 元素的內(nèi)容文本應(yīng)為 Hello World。

源代碼如下：

<h1>Hello</h1>

更改后如下：

<h1>Hello world</h1>

什么學(xué)習(xí)網(wǎng)頁制作？

互聯(lián)網(wǎng)時(shí)代的今天，各種各樣的網(wǎng)頁充斥著我們的生活。只要使用瀏覽器，打開的每一個(gè)頁面都可以稱之為網(wǎng)頁。即使使用頭條這樣的APP，其內(nèi)容布局、展示的方法也脫胎于網(wǎng)頁頁面設(shè)計(jì)的方法與原則。可以說頁面的概念已經(jīng)遍布我們的信息化世界。

作為蕓蕓眾生中的一員，學(xué)習(xí)網(wǎng)頁制作對(duì)我們的事業(yè)、生活有怎樣的幫助呢？

第一，學(xué)習(xí)網(wǎng)頁制作有助于理解網(wǎng)絡(luò)信息的傳播運(yùn)行機(jī)制，即使通過本課程不能全面了解這些核心機(jī)制，也能為大家鋪墊下繼續(xù)深入學(xué)習(xí)的知識(shí)基礎(chǔ)。即使自己不必親自制作網(wǎng)頁，在使用第三方工具時(shí)，比如微信公眾號(hào)、微信小程序或者其他自動(dòng)網(wǎng)頁或網(wǎng)站生成工具時(shí)也會(huì)比沒有基礎(chǔ)的人更快的掌握這些工具。

第二，學(xué)好網(wǎng)頁制作是制作網(wǎng)站的基礎(chǔ)，如果您因?yàn)槭聵I(yè)需要或者個(gè)人愛好打算制作自己的網(wǎng)站或博客，無論是打算使用php還是Java還是Python去構(gòu)建您的網(wǎng)站，精通網(wǎng)頁制作技術(shù)是您的第一塊技術(shù)基石。

第三，如果您打算學(xué)習(xí)網(wǎng)絡(luò)爬蟲來分析一些網(wǎng)絡(luò)數(shù)據(jù)，了解網(wǎng)頁頁面構(gòu)成也是必要基礎(chǔ)，至少您要知道一個(gè)網(wǎng)頁頁面中每個(gè)標(biāo)簽中對(duì)應(yīng)的是哪些信息，才能有的放矢拿到自己想要的信息。

第四，如果您想學(xué)習(xí)編程，但是缺少相應(yīng)的基礎(chǔ)知識(shí)，看不懂復(fù)雜的C語言教學(xué)，那么從網(wǎng)頁制作入手嘗試?yán)斫饩幊痰恼Z法也是一個(gè)很不錯(cuò)的選擇。

除此之外，瀏覽器可以做的事情越來越多，比如webgl的出現(xiàn)，可以讓我們通過瀏覽器構(gòu)建3d世界，無論是虛擬現(xiàn)實(shí)（VR）還是增強(qiáng)現(xiàn)實(shí)（AR）都有很多開源免費(fèi)的解決方案。TensorFlow的JavaScript版本的出現(xiàn)，讓我們可以通過結(jié)合瀏覽器學(xué)習(xí)使用人工智能技術(shù)，且非常容易實(shí)現(xiàn)。

所以，新的一年里，我打算做網(wǎng)頁制作的學(xué)習(xí)教程，讓更多沒有基礎(chǔ)卻對(duì)網(wǎng)絡(luò)技術(shù)感興趣的小伙伴能加入進(jìn)來。

制作網(wǎng)頁需要學(xué)習(xí)哪些技術(shù)？

簡(jiǎn)單來說學(xué)習(xí)網(wǎng)頁制作需要掌握三門技術(shù)。

第一，也是最基礎(chǔ)最核心的內(nèi)容是HTML超文本標(biāo)記語言。大家不必糾結(jié)HTML到底是什么，但是一定要記住它能干什么。HTML通俗來說可以比喻成容器。大家試想，網(wǎng)頁里都有哪些內(nèi)容呢？

一般網(wǎng)頁中都會(huì)有文字、圖片、聲音、視頻、表格等內(nèi)容，這些內(nèi)容就是靠HTML中的標(biāo)簽添加進(jìn)頁面的。

所以說HTML這個(gè)工具就是個(gè)容器，我們使用HTML標(biāo)簽語言為網(wǎng)頁添加所有需要的信息內(nèi)容。

第二，CSS層疊樣式表，這是一個(gè)用來裝飾頁面的工具。如果說HTML是個(gè)信息容器，那么如何讓這些信息條理清晰的顯示出來呢？那就需要CSS來幫忙了。如下圖所示，這是一個(gè)最簡(jiǎn)單的頁面，只用到了HTML，里面裝了一個(gè)標(biāo)題和一個(gè)只有六個(gè)字的段落。

為了讓這個(gè)頁面看起來美觀些，我們?yōu)槠涮砑觕ss樣式表。添加后如圖所示：

我們可以看出來，CSS讓標(biāo)題文字換了顏色，也居中顯示了，背景也變成了藍(lán)色。

第三，JavaScript，這個(gè)工具相比HTML和CSS來講是最難學(xué)習(xí)的，學(xué)習(xí)JavaScript就是在學(xué)習(xí)編程了。它雖然只是個(gè)腳本語言，但是用到的知識(shí)和其他編程語言相差不大。

那JavaScript能干什么呢？

首先，它能為頁面中添加很多交互效果。舉個(gè)例子，我們常見的圖片翻頁、輪播很多就是基于JavaScript腳本實(shí)現(xiàn)的。

其次，JavaScript可以為傳統(tǒng)頁面擴(kuò)展出很多新功能，例如結(jié)合three.js我們可以很容易的在頁面中構(gòu)建三維空間，或者實(shí)現(xiàn)一些3d游戲或其他三維動(dòng)態(tài)演示效果。舉個(gè)例子（https://renaultespace.littleworkshop.fr/），打開可能略慢。3d展示的汽車廣告是不是很酷！

再次，JavaScript可以以網(wǎng)頁為基礎(chǔ)，實(shí)現(xiàn)各種各樣的在線小游戲，例如Phaser.js就是目前非常火的一個(gè)開源免費(fèi)網(wǎng)頁游戲制作庫。phaser官網(wǎng)：http://phaser.io/

JavaScript為網(wǎng)頁的功能拓展提供了很多可能性，無論是3d顯示還是游戲制作還是未來的人工智能工具，都是由JavaScript都為大家提供了將功能引入到頁面的接口，這也是學(xué)習(xí)難度比較大的原因。不過只要堅(jiān)持下去一定能學(xué)通的！

網(wǎng)站與網(wǎng)頁的區(qū)別？

網(wǎng)頁是指我們看到的單個(gè)頁面。這些頁面分為靜態(tài)頁面和動(dòng)態(tài)頁面兩種。靜態(tài)頁面指的是不能與服務(wù)器進(jìn)行數(shù)據(jù)交互的頁面，顧名思義動(dòng)態(tài)頁面指的是可以與服務(wù)器進(jìn)行數(shù)據(jù)交互的頁面，這一點(diǎn)大家不必糾結(jié)。

簡(jiǎn)單來說，靜態(tài)頁面寫好后什么樣就是什么樣，誰打開都是事先編輯好的內(nèi)容，而動(dòng)態(tài)頁面寫好后會(huì)隨著不同的訪問變換不同數(shù)據(jù)，動(dòng)態(tài)頁面更像是一個(gè)頁面模板，隨時(shí)套用不同信息。

大部分網(wǎng)站中的頁面都是動(dòng)態(tài)頁面。

如果使用靜態(tài)頁面做網(wǎng)站會(huì)出現(xiàn)什么問題呢？如果您有300篇博客文章，那您就要做300個(gè)靜態(tài)頁面來顯示，大型資訊網(wǎng)站信息量更加龐大，如果都用靜態(tài)頁面來做，占用的服務(wù)器空間也是龐大到不可想象。

網(wǎng)站中的動(dòng)態(tài)頁面就解決了這個(gè)問題，例如一個(gè)簡(jiǎn)單的網(wǎng)站我們只需一個(gè)主頁、文章頁、搜索頁基本上就可以了，這些頁面中沒有具體內(nèi)容，我們稱之為模板。當(dāng)您打開后，顯示的內(nèi)容都是在數(shù)據(jù)庫中調(diào)出的。這樣，一個(gè)數(shù)據(jù)庫用來存儲(chǔ)壓縮過的精簡(jiǎn)信息，這些信息通過不同頁面模板顯示在用戶面前就成為網(wǎng)站的基本運(yùn)行模式。

例如在靜態(tài)頁面中顯示文字字?jǐn)?shù)的代碼是這樣

<p>300字</p>

如果使用以php編寫的WordPress網(wǎng)站框架來動(dòng)態(tài)顯示文章字?jǐn)?shù)就是這樣

<p><?php echo zm_count_words($text); ?></p>

<?php echo zm_count_words($text); ?>這條語句可以調(diào)取數(shù)據(jù)庫中文章字?jǐn)?shù)的記錄并顯示出來。這也我們通過這一條語句就可以顯示不同文章的字?jǐn)?shù)了。

無論是靜態(tài)頁面還是動(dòng)態(tài)頁面，他們的核心內(nèi)容都是一樣的，HTML，CSS，JavaScript都是必修知識(shí)。只是靜態(tài)頁面在HTML中插入信息，而動(dòng)態(tài)頁面插入的是調(diào)取數(shù)據(jù)庫信息的語句。

因此，我們這個(gè)教程看起來是在做靜態(tài)頁面，但是我們學(xué)習(xí)的也是制作網(wǎng)站的基礎(chǔ)知識(shí)。

本教學(xué)學(xué)完能干什么？

第一，可以寫出靜態(tài)頁面。

第二，有能力讀懂他人寫好的頁面代碼。

第三，為繼續(xù)深入學(xué)習(xí)網(wǎng)站制作或更為炫酷的頁面制作打下基礎(chǔ)。

第四，掌握編程基礎(chǔ)，至少是基于JavaScript的。

我是大魚，致力于數(shù)字藝術(shù)技術(shù)分享！歡迎大家關(guān)注！祝愿大家2020年學(xué)有所成！

HTML學(xué)習(xí)目錄

HTML是什么？——零基礎(chǔ)自學(xué)網(wǎng)頁制作

第一個(gè)HTML頁面如何寫？——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML頁面中head標(biāo)簽有啥用？——零基礎(chǔ)自學(xué)網(wǎng)頁制作

初識(shí)meta標(biāo)簽與SEO——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML中的元素使用方法1——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML中的元素使用方法2——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML元素中的屬性1——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML元素中的屬性2（路徑詳解）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

使用HTML添加表格1（基本元素）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

使用HTML添加表格2（表格頭部與腳部）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

使用HTML添加表格3（間距與顏色）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

使用HTML添加表格4（行顏色與表格嵌套）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

16進(jìn)制顏色表示與RGB色彩模型——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML中的塊級(jí)元素與內(nèi)聯(lián)元素——零基礎(chǔ)自學(xué)網(wǎng)頁制作

初識(shí)HTML中的<div>塊元素——零基礎(chǔ)自學(xué)網(wǎng)頁制作

在HTML頁面中嵌入其他頁面的方法——零基礎(chǔ)自學(xué)網(wǎng)頁制作

封閉在家學(xué)網(wǎng)頁制作！為頁面嵌入PDF文件——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML表單元素初識(shí)1——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML表單元素初識(shí)2——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML表單3（下拉列表、多行文字輸入）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML表單4（form的action、method屬性）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML列表制作講解——零基礎(chǔ)自學(xué)網(wǎng)頁制作

為HTML頁面添加視頻、音頻的方法——零基礎(chǔ)自學(xué)網(wǎng)頁制作

音視頻格式轉(zhuǎn)換神器與html視頻元素加字幕——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML中使用<a>標(biāo)簽實(shí)現(xiàn)文本內(nèi)鏈接——零基礎(chǔ)自學(xué)網(wǎng)頁制作

在線咨詢

上一篇：HTML 之簡(jiǎn)介
下一篇：20個(gè)超炫的html5視頻背景頁面

您的項(xiàng)目需求

*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。

整合營銷服務(wù)商