Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

Use Copilot to kickstart your CSS layout. Ctrl + i toggles the inline chat.

code's profile picture

Visual Studio Code

807,708 subscribers

65,757 Aufrufe • vor 2 Jahren •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

8 Kommentare

Profilbild von Visual Studio Code
Visual Studio Codevor 2 Jahren

Cmd + i on Mac

Profilbild von Hitesh Choudhary
Hitesh Choudharyvor 2 Jahren

I will be showing if off in my next youtube video 😁

Profilbild von Open Dev Log
Open Dev Logvor 2 Jahren

Love copilot!

Profilbild von g!
g!vor 2 Jahren

@oinotna_luiz @CaboRomansini

Profilbild von Дмитро *не виспався*
Дмитро *не виспався*vor 2 Jahren

Holly cow!

Profilbild von ycsg
ycsgvor 2 Jahren

如何实现分屏？预览

Profilbild von Jenan’s Husband
Jenan’s Husbandvor 2 Jahren

I just took a screenshot ...thanks

Profilbild von Sudaraka Senevirathne
Sudaraka Senevirathnevor 2 Jahren

a gem for full-stacked backend devs 🤣

Ähnliche Videos

I feel like the GitHub Copilot team created the Ctrl + s shortcut just for me!
0:58

I feel like the GitHub Copilot team created the Ctrl + s shortcut just for me!

Gwyneth Peña-Siguenza

20,962 Aufrufe • vor 29 Tagen

3 lines of CSS to make your tooltips/menus stay in view 🤯 (Check it! 👇) [popover] { top: anchor(top); left: anchor(right); position-try-options: flip-block, flip-inline; } Responds to scroll, layout change, etc. Watch the nested menu 👇 Anchor Positioning is coming 🚀
1:12

3 lines of CSS to make your tooltips/menus stay in view 🤯 (Check it! 👇) [popover] { top: anchor(top); left: anchor(right); position-try-options: flip-block, flip-inline; } Responds to scroll, layout change, etc. Watch the nested menu 👇 Anchor Positioning is coming 🚀

jhey ʕ•ᴥ•ʔ

484,069 Aufrufe • vor 2 Jahren

Quickly and easily create a CSS Grid layout for your website!
0:23

Quickly and easily create a CSS Grid layout for your website!

Marko Denic

211,392 Aufrufe • vor 1 Jahr

From Copilot Chat to Copilot in your PRs, the CLI, and much, much more. Join us for a look at the future of GitHub Copilot. 🔮
1:05

From Copilot Chat to Copilot in your PRs, the CLI, and much, much more. Join us for a look at the future of GitHub Copilot. 🔮

GitHub

295,053 Aufrufe • vor 3 Jahren

Make your tooltips and menus stay in view with 3 lines of CSS 🤙 .menu { top: anchor(top); left: anchor(right); position-try-fallbacks: flip-block, flip-inline; } Property updated 📝 Responds to scroll, layout change, etc. Watch 👇 Anchor Positioning is coming 🚀
0:26

Make your tooltips and menus stay in view with 3 lines of CSS 🤙 .menu { top: anchor(top); left: anchor(right); position-try-fallbacks: flip-block, flip-inline; } Property updated 📝 Responds to scroll, layout change, etc. Watch 👇 Anchor Positioning is coming 🚀

jhey ʕ•ᴥ•ʔ

88,055 Aufrufe • vor 2 Jahren

From Copilot Workspace to Copilot Chat, the future of the developer environment is AI-native on This is o1 & Copilot, right where you manage your code.
0:42

From Copilot Workspace to Copilot Chat, the future of the developer environment is AI-native on This is o1 & Copilot, right where you manage your code.

Thomas Dohmke

45,614 Aufrufe • vor 1 Jahr

responsive CSS pinned sidebar transition 📌 .layout:has(:popover-open) { grid-template-columns: var(--sidebar-width) 1fr; } aside:popover-open { translate: 0 var(--ctrl); height: var(--extend); } actual zero JS for the layout transition here so many details to play with! 🧑‍🍳
0:36

responsive CSS pinned sidebar transition 📌 .layout:has(:popover-open) { grid-template-columns: var(--sidebar-width) 1fr; } aside:popover-open { translate: 0 var(--ctrl); height: var(--extend); } actual zero JS for the layout transition here so many details to play with! 🧑‍🍳

jhey ʕ•ᴥ•ʔ

386,721 Aufrufe • vor 9 Monaten

New in TanStack Start: route-aware CSS inlining. Inline initial route CSS during SSR to reduce blocking stylesheet requests and improve FCP.
0:32

New in TanStack Start: route-aware CSS inlining. Inline initial route CSS during SSR to reduce blocking stylesheet requests and improve FCP.

TANSTACK

91,407 Aufrufe • vor 2 Monaten

CSS Tip! 🔮 Use scroll-linked animations to create list animations ✨ li { view-timeline: --i inline; } .card { scale: 0.8; animation-timeline: --i; animation: s; animation-delay:cover 40%; animation-end-delay:cover 60%; } keyframes s { 50% { scale:1; }} CodePen.IO link below!👇
0:36

CSS Tip! 🔮 Use scroll-linked animations to create list animations ✨ li { view-timeline: --i inline; } .card { scale: 0.8; animation-timeline: --i; animation: s; animation-delay:cover 40%; animation-end-delay:cover 60%; } keyframes s { 50% { scale:1; }} CodePen.IO link below!👇

jhey ʕ•ᴥ•ʔ

110,281 Aufrufe • vor 3 Jahren

CSS Tip! ✨ You can make your component styles portable with container queries 😎 Change a card layout based on size 🔥 Remove button text when it's small 🤏 .card {container-type: inline-size;} @ container (min-width: 50ch) {.info { grid-column: 2; }} CodePen.IO link below 👇
0:28

CSS Tip! ✨ You can make your component styles portable with container queries 😎 Change a card layout based on size 🔥 Remove button text when it's small 🤏 .card {container-type: inline-size;} @ container (min-width: 50ch) {.info { grid-column: 2; }} CodePen.IO link below 👇

jhey ʕ•ᴥ•ʔ

311,526 Aufrufe • vor 3 Jahren

Is your JSON data getting hung up with trailing commas or incorrect data types? Just ask GitHub Copilot Chat what’s wrong and how to fix it 🛠️ Learn more in the Copilot Chat Cookbook.
0:34

Is your JSON data getting hung up with trailing commas or incorrect data types? Just ask GitHub Copilot Chat what’s wrong and how to fix it 🛠️ Learn more in the Copilot Chat Cookbook.

GitHub

29,212 Aufrufe • vor 1 Jahr

4 ways to go from Figma layout to HTML/CSS with AI. The first method sucks. The fourth method is goated. Figma
6:55

4 ways to go from Figma layout to HTML/CSS with AI. The first method sucks. The fourth method is goated. Figma

Gary Simon

33,571 Aufrufe • vor 9 Monaten

Want your own PostgreSQL expert, right in Visual Studio Code? Use the PostgreSQL DBA chat mode for a more tailored chat experience! Find it in the repo, a community-contributed resource for customizing GitHub Copilot.
1:17

Want your own PostgreSQL expert, right in Visual Studio Code? Use the PostgreSQL DBA chat mode for a more tailored chat experience! Find it in the repo, a community-contributed resource for customizing GitHub Copilot.

Visual Studio Code

24,522 Aufrufe • vor 1 Jahr

As soon as I saw the GitHub Copilot SDK, I knew EXACTLY what I wanted to use it for!
2:22

As soon as I saw the GitHub Copilot SDK, I knew EXACTLY what I wanted to use it for!

Gwyneth Peña-Siguenza

120,831 Aufrufe • vor 6 Monaten

THE MUGGGGGGG. CTRL-ZA HAS ENTERED THE CHAT
0:27

THE MUGGGGGGG. CTRL-ZA HAS ENTERED THE CHAT

cel ⋆༄₊·˚✧

11,614 Aufrufe • vor 11 Monaten

I saw this nifty CSS Video Masking technique on the iPad website. Pretty neat use of CSS - not what I expected!
2:28

I saw this nifty CSS Video Masking technique on the iPad website. Pretty neat use of CSS - not what I expected!

Wes Bos

583,465 Aufrufe • vor 2 Jahren

Animated img carousel 🤙 Use CSS trig functions to get radius and layout images as a cylinder 🤓 Use scroll animation to rotate the cylinder 📜 :root { --a: calc((360 / var(--total)) * 1deg); --r: calc((var(--item-width) / sin(var(--a))) * -1); } Explained 👇
1:03

Animated img carousel 🤙 Use CSS trig functions to get radius and layout images as a cylinder 🤓 Use scroll animation to rotate the cylinder 📜 :root { --a: calc((360 / var(--total)) * 1deg); --r: calc((var(--item-width) / sin(var(--a))) * -1); } Explained 👇

jhey ʕ•ᴥ•ʔ

348,300 Aufrufe • vor 2 Jahren

How to use the COPILOT () Function in Excel 📊
0:59

How to use the COPILOT () Function in Excel 📊

Mike Tholfsen

10,948 Aufrufe • vor 3 Monaten

How to use the :where CSS selector to solve specificity problems ↓
0:24

How to use the :where CSS selector to solve specificity problems ↓

Sebastiano Guerriero

61,881 Aufrufe • vor 2 Jahren