熟悉度？ CSSBox Model? 權重? 怎麼看console? flexbox? display? css basics BS

<svg viewBox="0 0 248 31" class="text-slate-900 dark:text-white w-auto h-6"><path fill-rule="evenodd" clip-rule="evenodd" d="M25.517 0C18.712 0 14.46 3.382 12.758 10.146c2.552-3.382 5.529-4.65 8.931-3.805 1.941.482 3.329 1.882 4.864 3.432 2.502 2.524 5.398 5.445 11.722 5.445 6.804 0 11.057-3.382 12.758-10.145-2.551 3.382-5.528 4.65-8.93 3.804-1.942-.482-3.33-1.882-4.865-3.431C34.736 2.92 31.841 0 25.517 0zM12.758 15.218C5.954 15.218 1.701 18.6 0 25.364c2.552-3.382 5.529-4.65 8.93-3.805 1.942.482 3.33 1.882 4.865 3.432 2.502 2.524 5.397 5.445 11.722 5.445 6.804 0 11.057-3.381 12.758-10.145-2.552 3.382-5.529 4.65-8.931 3.805-1.941-.483-3.329-1.883-4.864-3.432-2.502-2.524-5.398-5.446-11.722-5.446z" fill="#38bdf8"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M76.546 12.825h-4.453v8.567c0 2.285 1.508 2.249 4.453 2.106v3.463c-5.962.714-8.332-.928-8.332-5.569v-8.567H64.91V9.112h3.304V4.318l3.879-1.143v5.937h4.453v3.713zM93.52 9.112h3.878v17.849h-3.878v-2.57c-1.365 1.891-3.484 3.034-6.285 3.034-4.884 0-8.942-4.105-8.942-9.389 0-5.318 4.058-9.388 8.942-9.388 2.801 0 4.92 1.142 6.285 2.999V9.112zm-5.674 14.636c3.232 0 5.674-2.392 5.674-5.712s-2.442-5.711-5.674-5.711-5.674 2.392-5.674 5.711c0 3.32 2.442 5.712 5.674 5.712zm16.016-17.313c-1.364 0-2.477-1.142-2.477-2.463a2.475 2.475 0 012.477-2.463 2.475 2.475 0 012.478 2.463c0 1.32-1.113 2.463-2.478 2.463zm-1.939 20.526V9.112h3.879v17.849h-3.879zm8.368 0V.9h3.878v26.06h-3.878zm29.053-17.849h4.094l-5.638 17.849h-3.807l-3.735-12.03-3.771 12.03h-3.806l-5.639-17.849h4.094l3.484 12.315 3.771-12.315h3.699l3.734 12.315 3.52-12.315zm8.906-2.677c-1.365 0-2.478-1.142-2.478-2.463a2.475 2.475 0 012.478-2.463 2.475 2.475 0 012.478 2.463c0 1.32-1.113 2.463-2.478 2.463zm-1.939 20.526V9.112h3.878v17.849h-3.878zm17.812-18.313c4.022 0 6.895 2.713 6.895 7.354V26.96h-3.878V16.394c0-2.713-1.58-4.14-4.022-4.14-2.55 0-4.561 1.499-4.561 5.14v9.567h-3.879V9.112h3.879v2.285c1.185-1.856 3.124-2.749 5.566-2.749zm25.282-6.675h3.879V26.96h-3.879v-2.57c-1.364 1.892-3.483 3.034-6.284 3.034-4.884 0-8.942-4.105-8.942-9.389 0-5.318 4.058-9.388 8.942-9.388 2.801 0 4.92 1.142 6.284 2.999V1.973zm-5.674 21.775c3.232 0 5.674-2.392 5.674-5.712s-2.442-5.711-5.674-5.711-5.674 2.392-5.674 5.711c0 3.32 2.442 5.712 5.674 5.712zm22.553 3.677c-5.423 0-9.481-4.105-9.481-9.389 0-5.318 4.058-9.388 9.481-9.388 3.519 0 6.572 1.82 8.008 4.605l-3.34 1.928c-.79-1.678-2.549-2.749-4.704-2.749-3.16 0-5.566 2.392-5.566 5.604 0 3.213 2.406 5.605 5.566 5.605 2.155 0 3.914-1.107 4.776-2.749l3.34 1.892c-1.508 2.82-4.561 4.64-8.08 4.64zm14.472-13.387c0 3.249 9.661 1.285 9.661 7.89 0 3.57-3.125 5.497-7.003 5.497-3.591 0-6.177-1.607-7.326-4.177l3.34-1.927c.574 1.606 2.011 2.57 3.986 2.57 1.724 0 3.052-.571 3.052-2 0-3.176-9.66-1.391-9.66-7.781 0-3.356 2.909-5.462 6.572-5.462 2.945 0 5.387 1.357 6.644 3.713l-3.268 1.82c-.647-1.392-1.904-2.035-3.376-2.035-1.401 0-2.622.607-2.622 1.892zm16.556 0c0 3.249 9.66 1.285 9.66 7.89 0 3.57-3.124 5.497-7.003 5.497-3.591 0-6.176-1.607-7.326-4.177l3.34-1.927c.575 1.606 2.011 2.57 3.986 2.57 1.724 0 3.053-.571 3.053-2 0-3.176-9.66-1.391-9.66-7.781 0-3.356 2.908-5.462 6.572-5.462 2.944 0 5.386 1.357 6.643 3.713l-3.268 1.82c-.646-1.392-1.903-2.035-3.375-2.035-1.401 0-2.622.607-2.622 1.892z" fill="currentColor"></path></svg> Tailwind css The 2023 State of CSS survey 9108 則問券中 Tailwindcss 的表現 Atomic CSS 原子化 CSS

Git 簡易操作流程 設定 git 本機切換到要同步 git 的資料夾，將資料 clone 下來 git clone https://xxxxxxxxxxx :::info clone 下來之後就會預設 pull default branch 了 :::

qwik logo Qwik 下個世代的前端框架？ 簡報內容皆擷取自官方課程 (免費) [1] Why Qwik? [2] What is Qwik? [3] DEMO

Wordpress 前後分離 前端篇 <font size="3">(不會有後端篇)</font> 用戶生活+ 簡訊插件 目錄 現況 (前端做了什麼) 工具 (Gulp, Vite)

CSS injection What? 可以在一個頁面上可以插入任何的 CSS 語法 (顧名思義: 你可以插入 <style> 這個標籤) 網站可以插入 HTML，但是由於 CSP 無法執行 JavaScript

vue-template-admin vue-element-admin vue-admin-template vue + element-ui - 登入 / 登出 - 權限驗證

前言 接下來將會從 jQuery 來學習 JavaScript 並瞭解結構及使用它，當然並不是要瞭解每一個功能都是怎麼做的，我們主要是希望從程式碼中瞭解自己是否能夠讀懂程式碼、並利用它的結構來學習。 jQuery 不論你有沒有寫過 jQuery 相信當你在看這一章節時絕對加減有聽過 jQuery，但是沒關係，jQuery只是 JavaScript 中的一個資源框架而已，而它的好處就是簡化許多語法，方便我們更快速少打一些字並協助我們處理一些跨瀏覽器的問題 (Firefox、Safari、Google Chrome、Internet Explorer)。 那這邊就不廢話，快依照課程範例來學哩吧。 <div id="main" class="container"> <h1>People</h1>

第一節 執行環境與詞彙環境 第二節 型別與運算子 第三節

初始化 前言 在撰寫實體物件語法的時候往往都會有一些錯誤，所以課堂上也特別舉例出來。 初始化 （initialization） 初始化只是一個章節名稱，但主要內容都是在講解比較常見的範例錯誤，舉例… var people = { { firstname: 'John',

函數建構子、「new」與 JavaScript 的歷史 前言 前面我們已經瞭解許多物件、原型繼承、原型鏈和物件屬性及方法，接下將更深入討論建立物件。 「new」 前面我們已經有講過幾種建立物件的方式，其中一個是物件實體語法。 var jack = { firstname: 'jack', lastname: 'Dec',

古典和原型繼承 繼承表示一個物件取用另一個物件屬性或方法，只要了解其簡單觀念就好了，許多人在解釋這區塊時常會用各種火車、汽車等等例子來做舉例，但講師認為直接講清楚會比較簡顯易懂。 那古典繼承和原型繼承是什麼呢?古典繼承在 C#、Java 裡都有，而且非常熱門。 而古典繼承裡面有非常多方法可以用 friend protected private

Objects and functions Objects and the dot 物件裡面可以包含三種東西 Primitive (property) Object (property) Function (method) 核心物件會有一個記憶體的位址，可以參考到這些電腦記憶體中的屬性(property)和方法(method)的位址空間，如下圖。

Global Variable (章節:型別與運算子) // index.html <script src="lib1.js"> <script src="lib2.js"> <script src="app.js"> // lib1.js var libraryName = 'lib1'

Syntax parsers 語法解析器 A program that reads your code and determines what it does and if its grammar is valid. Your code isn't magic. Someone else wrote a program to translate it for the computer. Execution contexts 執行環境 A wrapper to help manage the code that is running. There are lost sof lexical environments. Which one is currently running is managed via execution contexts. It can contain things beyond what you've written in your code. Lexical environment 詞彙環境

Dynamic Type (弱型別) You don't tell the engine what type of data a variable holds, it figures it out while your code is running - Variables can hold different types of values because it's all figured out during execution //Static Typing bool isNew = 'hello'; // an error //Dynamic Typing Var isNew = true; // no errors isNew = 'yup';