搜尋
首頁web前端css教學溪流交叉混亂

溪流交叉混亂

我應該使用WordPress還是React鉤子?
我應該使用D3還是CSS?
我應該使用Markdown還是JSON?
我可以在Gatsby中使用Flexbox嗎?
我可以在Jekyll中使用自定義屬性嗎?
我應該使用HTML還是雲?
如何在我的Vue網站上添加深色模式?

這些是嘲諷的,但是這裡有一個要點。了解一項技術是一個挑戰,也是了解技術如何合併在一起的另一個挑戰。

雖然上面的技術組合似乎令人困惑,但您很幸運,您知道足以發現它們令人困惑。這意味著您足夠了解這些技術,以至於您知道它們都不相關,或者他們做的或沒有任何阻止它們共同努力的東西。

我經常在初學者中看到這種混亂,這確實沒有什麼可恥的。這都是過程的一部分。

我還看到了與此網站的讀者的這種混亂,因為我們經常寫有關漂亮的基礎網絡技術,而不會介紹它們如何適應不同的抽象,例如JavaScript Frameworks或CMS s。例如,查看有關構建滑塊的這篇文章。它甚至沒有觸摸JavaScript;只是香草html和CSS。

也許經驗豐富的前端開發人員會知道他們可以在任何地方使用此滑塊代碼,因為它不取決於其他任何東西。但是,也有一些開發人員會像在JSX中一樣,所以我無法真正使用它。還是在NPM上?我永遠讓人們問我,他們在網站上找到的一些想法和技術是否可以在他們的WordPress網站上使用。

那麼,如何在WordPress網站上使用此滑塊代碼?好吧,因為它只是HTML和CSS,您可以在任何模板中使用HTML,將CSS放入網站的樣式表中,並且可以使用。但是,也許您想以某種方式管理WordPress本身中的幻燈片,而不是編輯模板文件。也許您有一種自定義的帖子類型的“幻燈片”,然後是一個自定義頁面,該頁面在滑塊的divs中輸出這些帖子的內容。更複雜,但基本上是相同的想法。如果您希望滑塊在React中工作,則可能是將某些類屬性更改為className並將CSS更改為React站點的造型。我們經常依靠CSS-Tricks上的基本技術,因為它使事情變得更加普遍,但是它仍然很有趣,並且是學習如何將概念移植到其他技術的另一種技能。

Lemme對上面的那些問題造成了破解。

我應該使用WordPress還是React鉤子?

WordPress是您選擇幫助您構建結構化內容並可能構建整個網站的CMS。您可以用React構建一個網站,這越來越受歡迎,但這並不常見。 React是一種用JavaScript構建的組件來構建站點前端的一種方式,以幫助模板和邏輯。 React鉤子是在組件之間共享功能的一種方式。因此,這個問題不是一個/或 - 您可以同時做。

我應該使用D3還是CSS?

CSS在所有網站上都用於進行樣式。 D3是用於進行數據可視化的JavaScript庫。有一些交叉,因為例如,您可以使用僅HTML和CSS構建條形圖,或者在D3中構建相同的條形圖。但是總的來說,D3正在做CSS無法使用的非常精美的圖紙,並且CSS正在在SVG(D3輸出)無法使用的站點上進行佈局。

我應該使用Markdown還是JSON?

Markdown是一種用於編寫彙編為HTML的內容的語言。例如,您可能會在Markdown中寫一篇博客文章,因為它可以清潔寫作,看和勸阻您在不應該的地方與HTML一起使用HTML。 JSON是一種以許多編程語言(尤其是JavaScript)的格式存儲數據的格式,可以輕鬆處理。 JSON具有相當直觀的嵌套鍵/值對語法。如果以這種方式存儲數據很有用,則可以將Markdown放在JSON中。有一些有趣的跨界車,因為有特殊的降價品種可以將元數據作為文件的一部分,稱為前提。儘管有些不同的語法,但此前提數據的數據也以鑰匙/值對格式。儘管如此,這些通常是完全不同的技術。 API通常會返回JSON,但不會返回Markdown,您通常會在Markdown中寫博客,而不是JSON。

我可以在Gatsby中使用Flexbox嗎?

當然。 Flexbox是CSS的東西,蓋茨比是一個反應框架。蓋茨比不在乎您在網站上使用的CSS。由於Gatsby是基於React的,因此可能還會使用CSS-IN-JS庫的整個世界,因此,如果您遇到麻煩,那可能與之相關。例如,如果正在通過JavaScript對象格式設置樣式,則可能必須使用諸如Flexgrow而不是Flex Grow等的內容。

我可以在Jekyll中使用自定義屬性嗎?

Jekyll是一個由紅寶石驅動的靜態站點生成器,主要用於從Markdown文件中生產博客。就像蓋茨比不在乎您的CSS一樣,Jekyll也不是。自定義屬性是CSS的東西,因此您可以在CSS中自由使用它們,而CSS又是Jekyll網站的一部分。

我應該使用HTML還是雲?

“雲”具有含糊的含義,但通常是指互聯網附加的服務器。不僅是一台服務器,而且還具有強大的擴展能力和具有冗餘的能力的大型網絡。 HTML是網站的基本語言。每個網站都從Web服務器的HTML請求開始。它們與基於雲的服務器有關,可能會為HTML文件提供這些請求!但是它們不是一個或什麼。您可以編寫由不是特別“多雲”的服務器提供的HTML,並且您可以將雲服務器用於與HTML無關的東西(例如存儲大數據文件)。

以上是溪流交叉混亂的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
每周平台新聞:Galaxy Store的Web應用程序,Tappable Stories,CSS Subgrid每周平台新聞:Galaxy Store的Web應用程序,Tappable Stories,CSS SubgridApr 14, 2025 am 11:20 AM

在本週的綜述中:Firefox獲得了類似鎖匠的力量,三星的Galaxy Store開始支持Progressive Web Apps,CSS Subgrid正在Firefox發貨

每周平台新聞:Internet Explorer模式,搜索控制台中的速度報告,限制通知提示每周平台新聞:Internet Explorer模式,搜索控制台中的速度報告,限制通知提示Apr 14, 2025 am 11:15 AM

在本週的綜述中:Internet Explorer進入Edge,Google搜索控制台吹捧新的速度報告,而Firefox給出了Facebook' s Notification

CSS自定義屬性的範圍的功率(和樂趣)CSS自定義屬性的範圍的功率(和樂趣)Apr 14, 2025 am 11:11 AM

您可能至少已經對CSS變量有點熟悉了。如果沒有,這是兩秒鐘的概述:它們真的稱為自定義屬性

我們是程序員我們是程序員Apr 14, 2025 am 11:04 AM

構建網站正在編程。編寫HTML和CSS正在編程。我是程序員,如果您在這裡閱讀CSS-Tricks,那麼您很有可能是您

您如何從網站上刪除未使用的CSS?您如何從網站上刪除未使用的CSS?Apr 14, 2025 am 10:59 AM

在這裡,我想預先知道的是:這是一個很難的問題。如果您降落在這裡,因為您希望指向您可以運行的工具

圖片中的圖片網絡API簡介圖片中的圖片網絡API簡介Apr 14, 2025 am 10:57 AM

圖片中的圖片在2016年發行了Macos Sierra,在Safari瀏覽器中首次出現在網絡上。這使用戶可以彈出

使用Gatsby組織和準備圖像以使圖像模糊效果的方法使用Gatsby組織和準備圖像以使圖像模糊效果的方法Apr 14, 2025 am 10:56 AM

蓋茨比(Gatsby)進行了出色的處理和處理圖像。例如,它可以幫助您節省圖像優化的時間,因為您不必手動

哦,嘿,填充百分比基於父元素的寬度哦,嘿,填充百分比基於父元素的寬度Apr 14, 2025 am 10:55 AM

今天,我學到了一些有關基於百分比的(%)填充的知識,我腦海中完全錯了!我一直認為百分比填充是基於

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
4 週前By尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解鎖Myrise中的所有內容
1 個月前By尊渡假赌尊渡假赌尊渡假赌

熱工具

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強大的PHP整合開發環境

SublimeText3 Linux新版

SublimeText3 Linux新版

SublimeText3 Linux最新版

VSCode Windows 64位元 下載

VSCode Windows 64位元 下載

微軟推出的免費、功能強大的一款IDE編輯器

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具