[B! CSS] izocã®ãƒ–ãƒƒã‚¯ãƒžãƒ¼ã‚¯

izoc id:izoc

CSSã«é–¢ã™ã‚‹izocã®ãƒ–ãƒƒã‚¯ãƒžãƒ¼ã‚¯ (12)

${{author_name}}$

{{{comment_expanded}}}

{{label}}

{{#is_bookmark}}ãƒªã‚¹ãƒˆ{{/is_bookmark}}{{^is_bookmark}}ãƒªãƒ³ã‚¯{{/is_bookmark}}

${{author_name}}$
{{author_name}}{{created}}
{{ #comment }}{{ comment }}{{ /comment }}
- {{ label }}

${{author_name}}$

{{{comment_expanded}}}

{{label}}

{{#is_bookmark}}ãƒªã‚¹ãƒˆ{{/is_bookmark}}{{^is_bookmark}}ãƒªãƒ³ã‚¯{{/is_bookmark}}

ä»¤å’Œ7å¹´ç‰ˆ ã‚ãªãŸãŒä½¿ã£ã¦ã‚ˆã„ãƒ•ãƒãƒ³ãƒˆã‚¨ãƒ³ãƒ‰æ©Ÿèƒ½ã¨ã¯
2025/1/18 åŒ—é™¸ä¸‰çœŒ.rb Lightning Talks in Kanazawa
izoc 2025/01/19
Baseline

ãƒ•ãƒãƒ³ãƒˆã‚¨ãƒ³ãƒ‰

javascript

css

mdn
ãƒªãƒ³ã‚¯
ä»¤å’Œã®HTML / CSS / JavaScriptã®æ›¸ãæ–¹50é¸
Webåˆ¶ä½œã®æŠ€è¡“ã¯æ—¥ã€…é€²åŒ–ã—ã¦ãŠã‚Šã€ä¼šç¤¾ã‚„ãƒ—ãƒã‚¸ã‚§ã‚¯ãƒˆã«ã‚ˆã£ã¦ã¯æ˜¨ä»Šã®ç’°å¢ƒã«é©ã•ãªã„æ›¸ãæ–¹ã‚’ã—ã¦ã„ã‚‹ã‚±ãƒ¼ã‚¹ã‚‚æ™‚æŠ˜è¦‹å—ã‘ã‚‰ã‚Œã¾ã™ã€‚ ãã“ã§ä»Šå›žã¯ã€Œ2024å¹´ã®Webåˆ¶ä½œã§ã¯ã“ã®ã‚ˆã†ã«ã‚³ãƒ¼ãƒ‰ã‚’æ›¸ã„ã¦ã»ã—ã„ï¼ã€ã¨ã„ã†å†…å®¹ã‚’ã¾ã¨ã‚ã¾ã—ãŸã€‚ è³ªã‚ˆã‚Šé‡ã§ã€ã¾ãšã¯ã€Œã“ã‚“ãªæ›¸ãæ–¹ãŒã‚ã‚‹ã‚“ã ã€ã‚’ã“ã®è¨˜äº‹ã§ä¼ãˆãŸã‹ã£ãŸã®ã§ã€ã‚³ãƒ¼ãƒ‰ã®è©³ç´°ã¯ã‚ã¾ã‚Šè§£èª¬ã—ã¦ã„ã¾ã›ã‚“ã€‚ãªã®ã§ã€å…·ä½“çš„ãªä»•æ§˜ãªã©ã‚’ç¢ºèªã—ãŸã„æ–¹ã¯å‚è€ƒè¨˜äº‹ã‚’èªã‚“ã ã‚Šã”è‡ªèº«ã§èª¿ã¹ã¦ã„ãŸã ã‘ã‚‹ã¨å¹¸ã„ã§ã™ã€‚ 1. HTML ç”»åƒå‘¨ã‚Šã¯ã‚µã‚¤ãƒˆãƒ‘ãƒ•ã‚©ãƒ¼ãƒžãƒ³ã‚¹ã«ç›´çµã™ã‚‹ã®ã§ã€ã¾ãšã¯ãã“ã ã‘ã§ã‚‚å–ã‚Šå…¥ã‚Œã¦ã„ãŸã ããŸã„ã§ã™ã€‚ã¾ãŸã€ã‚³ã‚¢ã‚¦ã‚§ãƒ–ãƒã‚¤ã‚¿ãƒ«ã‚„ã‚¢ã‚¯ã‚»ã‚·ãƒ“ãƒªãƒ†ã‚£ã‚‚ä½µã›ã¦ç†è§£ã—ã¦ãŠããŸã„å†…å®¹ã§ã™ã€‚ Lazy loading <img>ã«loading="lazy"å±žæ€§ã‚’ä»˜ã‘ã‚‹ã¨ç”»åƒãŒé…å»¶èªã¿è¾¼ã¿ã«ãªã‚Šã€ã‚µã‚¤ãƒˆã®èªã¿è¾¼ã¿æ™‚é–“ãŒæ—©ããªã‚Šã¾ã™ã€‚
izoc 2024/05/14
jsã¯çµæ§‹ã‚ãƒ£ãƒƒãƒã‚¢ãƒƒãƒ—å‡ºæ¥ã¦ãŸãŒhtmlã¨cssã¯é ‘å¼µã‚‰ã‚“ã¨ãª

ã¾ã¨ã‚

html

css

javascript

Web

ã‚ã¨ã§èªã‚€
ãƒªãƒ³ã‚¯
CSSã®çŸ¥ã£ã¦ãŠãã¨ä¾¿åˆ©ãªå®Ÿè£…ãƒ†ã‚¯ãƒ‹ãƒƒã‚¯ï¼ ç›¸å¯¾ã‚«ãƒ©ãƒ¼æ§‹æ–‡ã‚’ä½¿ç”¨ã—ã¦ã€1ã¤ã®ã‚«ãƒ©ãƒ¼ã«å¯¾ã—ã¦æ¿ƒãè–„ãã‚’ç°¡å˜ã«è¨å®šã§ãã¾ã™
ç•°ãªã‚‹ã‚«ãƒ©ãƒ¼ã‚’æ¿ƒãã—ãŸã‚Šè–„ãã—ãŸã‚Šã™ã‚‹ã¨ãã€å€‹åˆ¥ã«ã‚«ãƒ©ãƒ¼ã‚’è¨å®šã—ã¦ã‚‚ã§ãã¾ã™ãŒã€CSSã®ç›¸å¯¾ã‚«ãƒ©ãƒ¼æ§‹æ–‡ï¼ˆcolor: rgb(from green r g b);ï¼‰ã‚’ä½¿ç”¨ã™ã‚‹ã¨ç°¡å˜ã«å®Ÿè£…ã§ãã¾ã™ã€‚ ä¸‹è¨˜ã¯ãã‚Œãžã‚Œå…ƒã®ã‚«ãƒ©ãƒ¼ã«å¯¾ã—ã¦ç›¸å¯¾ã‚«ãƒ©ãƒ¼æ§‹æ–‡1ã¤ã§ãã®ã‚«ãƒ©ãƒ¼ã‚’æ¿ƒãã—ãŸã‚Šè–„ãã—ãŸã‚Šã—ã¦ã„ã¾ã™ã€‚1ã¤ã®ã‚«ãƒ©ãƒ¼ã«å¯¾ã—ã¦è¤‡æ•°ã®æ¿ƒã•ãŒå¿…è¦ãªå ´åˆã«ä¾¿åˆ©ã§ã™ã€‚ CSSã®ç›¸å¯¾ã‚«ãƒ©ãƒ¼æ§‹æ–‡ã¨ã¯ CSSã®ç›¸å¯¾ã‚«ãƒ©ãƒ¼æ§‹æ–‡ã®ãƒ‡ãƒ¢ CSSã®ç›¸å¯¾ã‚«ãƒ©ãƒ¼æ§‹æ–‡ã¨ã¯ CSSã®ç›¸å¯¾ã‚«ãƒ©ãƒ¼ï¼ˆCSS Relative colorsï¼‰æ§‹æ–‡ã‚’ä½¿ç”¨ã™ã‚‹ã¨ã€ä»–ã®ã‚«ãƒ©ãƒ¼ã®ãƒ‘ãƒ©ãƒ¡ãƒ¼ã‚¿ã‚’å¤‰æ›´ã—ã¦ã‚«ãƒ©ãƒ¼ã‚’å®šç¾©ã§ãã¾ã™ã€‚ç›¸å¯¾ã‚«ãƒ©ãƒ¼æ§‹æ–‡ã¯è¨å®šã—ãŸè‰²ã‚’ç›¸å¯¾è‰²ã«å¤‰æ›ã—ã¾ã™ã€‚å¤‰æ›ã«ã¯ã€fromã‚ãƒ¼ãƒ¯ãƒ¼ãƒ‰ã‚’ä½¿ç”¨ã—ã¾ã™ã€‚ãƒ–ãƒ©ã‚¦ã‚¶ã¯ãƒ™ãƒ¼ã‚¹ã®ã‚«ãƒ©ãƒ¼ã‚’å¤‰æ›ã—ã¦åˆ†è§£ã—ã€æ–°ã—ã„ã‚«ãƒ©ãƒ¼ã®å®šç¾©ã§ä½¿ç”¨ã™ã‚‹å¤‰æ•°ã¨ã—ã¦ä½¿ç”¨ã§ãã¾ã™ã€‚
izoc 2024/03/27
ã“ã‚Œæ¬²ã—ã‹ã£ãŸã‚„ã¤ã€‚ãƒ€ãƒ¼ã‚¯ãƒ¢ãƒ¼ãƒ‰ã§ã¡ã¾ã¡ã¾cssã‚„åˆ‡æ›¿å‡¦ç†ã‚’æ›¸ã‹ãªãã¦è‰¯ã„

css

color
ãƒªãƒ³ã‚¯
ã¤ã„ã«Chromeã§ä½¿ãˆã‚‹ã‚ˆã†ã«ãªã£ãŸCSSã®ä¾¿åˆ©æ©Ÿèƒ½ï¼ light-dark()é–¢æ•°ã€field-sizingãƒ—ãƒãƒ‘ãƒ†ã‚£ã€å¥èªç‚¹æ‹¬å¼§ã®ã‚«ãƒ¼ãƒ‹ãƒ³ã‚°ãŒã§ãã‚‹text-spacing-trimãƒ—ãƒãƒ‘ãƒ†ã‚£
ä»Šå›žã®ã‚¢ãƒƒãƒ—ãƒ‡ãƒ¼ãƒˆã§ã¯ã€ã‹ãªã‚Šä¾¿åˆ©ãªCSSã®ãƒ—ãƒãƒ‘ãƒ†ã‚£ãŒè¿½åŠ ã•ã‚Œã¾ã—ãŸã€‚ ãƒ©ã‚¤ãƒˆãƒ¢ãƒ¼ãƒ‰ã¨ãƒ€ãƒ¼ã‚¯ãƒ¢ãƒ¼ãƒ‰ã®ã‚¹ã‚¿ã‚¤ãƒ«ã‚’ç°¡å˜ã«å®šç¾©ã§ãã‚‹light-dark()ã‚«ãƒ©ãƒ¼é–¢æ•°ã€åž‚ç›´æ–¹å‘ã®ä¸å¤®ã«é…ç½®ã™ã‚‹align-contentãƒ—ãƒãƒ‘ãƒ†ã‚£ã€ãƒ•ã‚©ãƒ¼ãƒ ã®ã‚µã‚¤ã‚ºã‚’å…¥åŠ›ã•ã‚ŒãŸæ–‡å—é‡ã«åˆã‚ã›ã¦è‡ªå‹•å¤‰æ›´ã™ã‚‹field-sizingãƒ—ãƒãƒ‘ãƒ†ã‚£ã€CSSã§å¥èªç‚¹æ‹¬å¼§ã®ã‚«ãƒ¼ãƒ‹ãƒ³ã‚°ãŒã§ãã‚‹text-spacing-trimãƒ—ãƒãƒ‘ãƒ†ã‚£ã€ã“ã‚Œã‚‰ãŒãƒ–ãƒ©ã‚¦ã‚¶ã«ã‚µãƒãƒ¼ãƒˆã•ã‚Œã‚‹ã®ã‚’å¾…ã£ã¦ã„ãŸäººã‚‚å¤šã„ã¨æ€ã„ã¾ã™ã€‚ Chrome 123 beta New in Chrome 123 ä¸‹è¨˜ã¯å„ãƒã‚¤ãƒ³ãƒˆã‚’æ„è¨³ã—ãŸã‚‚ã®ã§ã™ã€‚ â€»å…ƒã‚µã‚¤ãƒˆæ§˜ã®ãƒ©ã‚¤ã‚»ãƒ³ã‚¹ã«åŸºã¥ã„ã¦ç¿»è¨³ã—ã¦ã„ã¾ã™ã€‚åŸºã¥ã„ã¦ã¨ã„ã†ã®ã¯ã€è²¢çŒ®éƒ¨åˆ†ã«é–¢ã—ã¦åŒãƒ©ã‚¤ã‚»ãƒ³ã‚¹ã‚‚å«ã¿ã¾ã™ã€‚ ã¯ã˜ã‚ã« CSSã®light-dark()ã‚«ãƒ©ãƒ¼é–¢æ•° CSSã®display-modeã§picture-in-p
izoc 2024/03/26
light-dark()ã¯ç†±ã„

css

chrome

webãƒ‡ã‚¶ã‚¤ãƒ³
ãƒªãƒ³ã‚¯
Webãƒ•ãƒãƒ³ãƒˆã‚¨ãƒ³ãƒ‰å…¥é–€
ã¾ãšã¯ã˜ã‚ã« HTMLã€CSSã€JSã‚’å¦ã‚“ã å¾Œã«ãƒ¢ãƒ€ãƒ³ãªwebåˆ¶ä½œã‚’è¡Œã†ä¸Šã§ã“ã‚Œã‹ã‚‰ä½•ã‚’å¦ã¹ã°ã„ã„ã ã‚ã†ã¨æ‰‹æŽ¢ã‚ŠçŠ¶æ…‹ã ã£ãŸéŽåŽ»ãŒã‚ã‚‹ã®ã§ã€ä»ŠåŒã˜æ‚©ã¿ã‚’æŠ±ãˆã¦ã„ã‚‹æ–¹ã«å‘ã‘ã¦ã“ã®è¨˜äº‹ã‚’æ›¸ã“ã†ã¨æ€ã„ã¾ã—ãŸã€‚ã¾ãŸã€è‡ªåˆ†è‡ªèº«ãŒ2023å¹´ã«å¤šãã®ã“ã¨ã‚’å¦ã‚“ã ã®ã§ãã‚Œã®æ•´ç†ã«ãªã‚Œã°ã¨ã„ã†æ€ã„ã‚‚ã‚ã‚Šã¾ã™ã€‚ ã‚ã¨ã€ã„ã„ãã€ã‚³ãƒ¡ãƒ³ãƒˆã„ãŸã ã‘ã‚‹ã¨è¨˜äº‹ä½œæˆã®åŠ±ã¿ã«ãªã‚Šã¾ã™ðŸ˜‡ ã“ã®è¨˜äº‹ã®å¯¾è±¡è€… HTML, CSS, JSã¯ã‚ã‚‹ç¨‹åº¦ç†è§£ã—ãŸ ãƒ¢ãƒ€ãƒ³ãªWebåˆ¶ä½œã‚’è¡Œã„ãŸã„ ã“ã‚Œã‹ã‚‰å¦ã¶ã¹ãæŠ€è¡“ React, Next.js ä¸€åº¦ã¯èžã„ãŸã“ã¨ã‚ã‚‹äººã‚‚å¤šã„ã¨æ€ã„ã¾ã™ã€‚ã“ã‚Œã¯ã€Webã‚µã‚¤ãƒˆã‚’åŠ¹çŽ‡çš„ã«é–‹ç™ºã™ã‚‹ã“ã¨ã‚’ç›®çš„ã«ä½œã‚‰ã‚ŒãŸJSã®ãƒ•ãƒ¬ãƒ¼ãƒ ãƒ¯ãƒ¼ã‚¯(æ£ç¢ºã«ã„ã†ã¨Reactã¯ãƒ©ã‚¤ãƒ–ãƒ©ãƒª)ã§ã™ã€‚ Reactã¯Facebookç¤¾ãŒé–‹ç™ºã—ãŸã‚‚ã®ã§ã€ãã‚Œã‚’Vercelç¤¾ãŒã‚ˆã‚Šä½¿ã„ã‚„ã™ãã—ãŸã‚‚ã®ãŒNext.jsã§ã™ã€‚ ä½œæˆã™ã‚‹ã‚‚ã®ã«ã‚ˆã£
izoc 2024/01/08
ãƒ•ãƒãƒ³ãƒˆã‚¨ãƒ³ãƒ‰è¦šãˆã‚‹ã“ã¨å¤šã™ãŽã˜ã‚ƒãï¼Ÿ

css

UI

é–‹ç™º

html
ãƒªãƒ³ã‚¯
ä¾¿åˆ©ã§å·®ãŒã¤ãã€ãšã‚‹ã„Webåˆ¶ä½œãƒ„ãƒ¼ãƒ«ãƒ»ç´ æ90é¸ã€2023å¹´ãƒ™ã‚¹ãƒˆã€‘
2023å¹´ã‚‚çµ‚ã‚ã‚Šã«è¿‘ã¥ãã€ã“ã®1å¹´é–“ã«åŽé›†ã—ãŸãƒ„ãƒ¼ãƒ«ã‚’æŒ¯ã‚Šè¿”ã‚ŠãªãŒã‚‰ã€Webåˆ¶ä½œã«å½¹ç«‹ã¤ãŠæ°—ã«å…¥ã‚Šã‚’è¦‹ã¤ã‘ã¦ã¿ã¾ã—ã‚‡ã†ã€‚ ç´ æ™´ã‚‰ã—ã„æ–°ãƒ„ãƒ¼ãƒ«ã‚„ç´ æãŒãŸãã•ã‚“ãƒªãƒªãƒ¼ã‚¹ã•ã‚Œã€é¸å®šã«ã¯ãŸã£ã·ã‚Šæ™‚é–“ãŒã‹ã‹ã‚Šã¾ã—ãŸãŒã€ã‚«ãƒ†ã‚´ãƒªåˆ¥ã«å¹…åºƒãã‚»ãƒ¬ã‚¯ã‚·ãƒ§ãƒ³ã§ãã¾ã—ãŸã€‚ æœ¬å½“ã«å½¹ç«‹ã¤ã‹ã©ã†ã‹ã ã‘ã‚’è€ƒãˆã€ã€Œã“ã‚Œã€ç¥žãƒ„ãƒ¼ãƒ«ã€‚ã€ã¨æ€ãˆã‚‹ã‚‚ã®ã‚’ãƒ”ãƒƒã‚¯ã‚¢ãƒƒãƒ—ã€‚ è©±é¡Œã®çš„ã ã£ãŸAIã‚’ã†ã¾ãæ´»ç”¨ã™ã‚Œã°ã€ãƒ¯ãƒ¼ã‚¯ãƒ•ãƒãƒ¼ã‚’æ ¼æ®µã«ã‚¹ãƒ”ãƒ¼ãƒ‰ã‚¢ãƒƒãƒ—ã•ã›ã€é¢å€’ãªä½œæ¥ã‚‚ã‚¹ãƒˆãƒ¬ã‚¹ãªãã“ãªã™ã“ã¨ãŒã§ãã¾ã™ã€‚ ã“ã®è¨˜äº‹ã§ã¯ã€ãã‚“ãªã‚ãªãŸã®å½¹ã«ç«‹ã¤2023å¹´å…¬é–‹ã®Webãƒ‡ã‚¶ã‚¤ãƒ³åˆ¶ä½œãƒ„ãƒ¼ãƒ«ã‚„ç´ æã‚’ã¾ã¨ã‚ã¦ã”ç´¹ä»‹ã—ã¾ã™ã€‚ æ•´ç†ã—ãŸã‚«ãƒ†ã‚´ãƒªã¯ä»¥ä¸‹ã®é€šã‚Šã€‚
izoc 2023/12/20
è‰¯ã„ãã€‚

UI

css

Web

ãƒ‡ãƒ¢

ãƒ„ãƒ¼ãƒ«
ãƒªãƒ³ã‚¯
Neumorphism/Soft UI CSS shadow generator
CSS code generator that will help with colors, gradients and shadows to adapt this new design trend or discover its posibilities.
izoc 2023/11/13
UI

css

ãƒ‹ãƒ¥ãƒ¼ãƒ¢ãƒ¼ãƒ•ã‚£ã‚ºãƒ

webã‚µãƒ¼ãƒ“ã‚¹

ãƒ‡ã‚¶ã‚¤ãƒ³
ãƒªãƒ³ã‚¯
å…¨æ¨™æº–ãƒ•ã‚©ãƒ³ãƒˆä¸€è¦§ / ã‚‚ã†ãƒ‘ãƒ³ãƒ„ã¯ã‹ãªã„
æ¨™æº–ã§å…¥ã£ã¦ã‚‹ã¨æ€ã‚ã‚Œã‚‹ãƒ•ã‚©ãƒ³ãƒˆã®ãƒªã‚¹ãƒˆã§ã™ã€‚æ—¥æœ¬èªžãƒ»è‹±èªžä»¥å¤–ã®è¨€èªžç”¨ã®ãƒ•ã‚©ãƒ³ãƒˆã‚‚æ··ã˜ã£ã¦ã¾ã™(ãŸã ã—ãã¡ã‚“ã¨è‹±æ•°å—ãŒå«ã¾ã‚Œã‚‹ã‚‚ã®ã®ã¿)ã€‚ ãƒ•ã‚©ãƒ³ãƒˆã®ã‚ãƒ£ãƒ—ãƒãƒ£ç”»åƒã®ä¸‹ã«ã€CSSã§ãƒ•ã‚©ãƒ³ãƒˆæŒ‡å®šã‚’ã—ã¦ã„ã¾ã™ã€‚ã‚¤ãƒ³ã‚¹ãƒˆãƒ¼ãƒ«ã•ã‚Œã¦ã„ã‚Œã°ãã®ãƒ•ã‚©ãƒ³ãƒˆã§è¡¨ç¤ºã•ã‚Œã‚‹ã¯ãšã§ã™ãŒã€ãƒ–ãƒ©ã‚¦ã‚¶ã‚„è¨å®šã«ã‚ˆã£ã¦ã¯æŒ‡å®šãŒåŠ¹ã‹ãªã„ãƒ•ã‚©ãƒ³ãƒˆã‚‚ã‚ã‚Šã¾ã™ã€‚æ–œä½“ä»¥å¤–ã®æ–‡å—ã®å¤ªã•ãƒ»å¹…ã®ãƒãƒªã‚¨ãƒ¼ã‚·ãƒ§ãƒ³ã‚‚æ‹¾ã„ã ã—ã¦ã¿ã¾ã—ãŸã€‚ãƒšãƒ¼ã‚¸ãƒ‡ã‚¶ã‚¤ãƒ³ã®å‚è€ƒã«ã©ã†ãžã€‚ å„æž å³ä¸Šã®ä¸‰è§’å°ã‚’ã‚¯ãƒªãƒƒã‚¯ã™ã‚‹ã¨CSSã‚’è¡¨ç¤ºã—ã€Ã—å°ã®ã‚¯ãƒªãƒƒã‚¯ã§é–‰ã˜ã¾ã™ã€‚ã¾ãŸå³å´ã®ãƒ”ãƒ³ã‚¯è‰²ã®æž ã¸ãƒ‰ãƒ©ãƒƒã‚°ã—ã¦å–ã‚Šç½®ãã™ã‚‹ã“ã¨ãŒã§ãã¾ã™ã€‚å–ã‚Šç½®ãã‚’æ¨ã¦ãŸã‚Šä¸¦ã¹æ›¿ãˆãŸã‚Šã‚‚ã§ãã¾ã™ã€‚(IE9ä»¥å‰ã¨ã‚¹ãƒžãƒ›ãƒ»ã‚¿ãƒ–ãƒ¬ãƒƒãƒˆã§ã¯å–ã‚Šç½®ãã§ãã¾ã›ã‚“) ãªãŠã€Macç”¨ã§æž ã®å³ç«¯ãŒèµ¤ã„ã‚‚ã®ã¯ã€å¿…è¦ã«å¿œã˜ã¦ãƒ€ã‚¦ãƒ³ãƒãƒ¼ãƒ‰ã§ãã‚‹ãƒ•ã‚©ãƒ³ãƒˆã§ã™ã€‚(è¨€èªžã‚’æ—¥æœ¬èªžã¨ã—ã¦macOSã‚’ã‚¤ãƒ³ã‚¹ãƒˆãƒ¼ãƒ«ã—ãŸå ´åˆã¯ä¸‹ã®ãƒ•ã‚©
izoc 2011/03/21
æ¨™æº–ãƒ•ã‚©ãƒ³ãƒˆä¸€è¦§ã€‚

css

ãƒ•ã‚©ãƒ³ãƒˆ

Webãƒ‡ã‚¶ã‚¤ãƒ³

ã“ã‚Œã¯ä¾¿åˆ©
ãƒªãƒ³ã‚¯
ãƒ›ãƒ¼ãƒ ãƒšãƒ¼ã‚¸ä½œæˆã€€ã‚¿ãƒ–ãƒ¡ãƒ‹ãƒ¥ãƒ¼ã®ä½œã‚Šæ–¹ï¼ˆï¼‘ï¼‰Â -Â WEBã‚µã‚¤ãƒˆä½œæˆã€€ãƒ•ãƒªãƒ¼ç´ æã‚³ãƒ¼ãƒ‰ã€€ã®1uphp.com ã‚¹ã‚¿ã‚¤ãƒ«ã‚·ãƒ¼ãƒˆ,htmlã‚„Firefox,Operaãªã©ã®ãƒ–ãƒ©ã‚¦ã‚¶ã®è¡¨ç¤ºçµæžœã¾ã§ã€‚
ã€æ¦‚è¦ã€‘ é¸æŠžã•ã‚Œã¦ã„ã‚‹ã‚¿ãƒ–ã®è‰²ãŒæ¿ƒãã€é¸æŠžã•ã‚Œã¦ã„ãªã„æ–¹ã¯è–„ã„è‰²ã‚’æŒ‡å®šã€‚ é¸æŠžä¸ã®è‰²â– (#ff3333) â†â†’ é¸æŠžå¤–ã®è‰²â– (#ffcccc) ï¼ˆãã®ä»–ã®ãƒ‘ã‚¿ãƒ¼ãƒ³ã®ä¸€è¦§ã¯ã‚¿ãƒ–ãƒ¡ãƒ‹ãƒ¥ãƒ¼ã®ã„ã‚ã„ã‚ï¼ˆä¸€è¦§ï¼‰ã§è¦‹ã‚Œã¾ã™ã€‚ï¼‰ ã€é‡è¦ã€‘ ã€Žã‚¿ãƒ–ã€ã®è‰²ã¨åŒè‰²ã®å¸¯ã³ã‚’ã€ãã®ç›´ä¸‹ã«è¨ç½®ã™ã‚‹äº‹ãŒé‡è¦ã§ã™ã€‚ ã“ã‚Œã¯ã€ï¼’è‰²ã®å ´åˆã§ã‚‚ã€è¤‡æ•°è‰²ã§ã‚‚ã€ç”»åƒã‚’ä½¿ç”¨ã™ã‚‹å ´åˆã§ã‚‚å…±é€šã«é‡è¦ãªäº‹ã§ã™ã€‚ ï¼ˆã€Žç¾åœ¨è¨ªå•ã—ã¦ã„ã‚‹ãƒšãƒ¼ã‚¸ãŒã€ãƒ¡ãƒ‹ãƒ¥ãƒ¼ã®ã©ã“ã¨ä¸€è‡´ã—ã¦ã„ã‚‹ã‹ã€‚ã€ã‚’è¡¨ç¾ã™ã‚‹ç‚ºã§ã™ã€‚ï¼‰ ç¾åœ¨è¨ªå•ã—ã¦ã„ã‚‹ãƒšãƒ¼ã‚¸è‡ªä½“ã®ãƒªãƒ³ã‚¯ã¯é¸æŠžã§ããªã„æ§˜ã«ã™ã‚‹ã®ãŒä¸€èˆ¬çš„ã§ã™ãŒã€ãƒªãƒ³ã‚¯è‡ªä½“ã®<a href="ãƒªãƒ³ã‚¯å…ˆ">ï½ž</a>ã‚’å®Œå…¨ã«å–ã£ã¦ã—ã¾ã†ã¨ã€ã‚¹ã‚¿ã‚¤ãƒ«ã‚·ãƒ¼ãƒˆã‚’å¤–ã—ãŸå ´åˆã‚„ã€ãƒ†ã‚ã‚¹ãƒˆãƒ–ãƒ©ã‚¦ã‚¶ãªã©ã§ãƒªãƒ³ã‚¯éƒ¨åˆ†ãŒä¸æ˜Žã«ãªã£ã¦ã—ã¾ã„ã¾ã™ã®ã§ã€ã€Žãƒžã‚¦ã‚¹ã‚ªãƒ¼ãƒãƒ¼ã€æ™‚ã«ã€Žä½•ã‚‚å¤‰åŒ–ãªã„çŠ¶æ…‹ã€ãŒè‰¯ã„ã¨æ€ã‚ã‚Œã¾ã™ã€‚
izoc 2011/03/07
ã‚¿ãƒ–ãƒ¡ãƒ‹ãƒ¥ãƒ¼ã®ä½œã‚Šæ–¹

css

html

webãƒ‡ã‚¶ã‚¤ãƒ³
ãƒªãƒ³ã‚¯
CSSã«ã‚ˆã‚‹ãƒœã‚¿ãƒ³ã‚¹ã‚¿ã‚¤ãƒªãƒ³ã‚°ä¾‹ã„ã‚ã„ã‚:phpspoté–‹ç™ºæ—¥èªŒ
CSSã«ã‚ˆã‚‹ãƒœã‚¿ãƒ³ã‚¹ã‚¿ã‚¤ãƒªãƒ³ã‚°ä¾‹ãŒè‰²ã€…ã¨ã¾ã¨ã¾ã£ãŸã‚¨ãƒ³ãƒˆãƒªã®ã”ç´¹ä»‹ã€‚ buttonã‚¿ã‚°ãªã‚“ã‹ã‚’ä½¿ã£ã¦ãƒœã‚¿ãƒ³ã‚’ã‚¹ã‚¿ã‚¤ãƒªãƒ³ã‚°ã™ã‚‹ä¾‹ãŒè±Šå¯Œã§ã€CSSãƒœã‚¿ãƒ³ä½œæˆæ™‚ã®å‚è€ƒã«ã§ããã†ã§ã™ã€‚ ãƒªãƒ³ã‚¯å…ˆã¯ä»¥ä¸‹ã®ã‚¨ãƒ³ãƒˆãƒªã‚’å‚ç…§ã—ã¦ãã ã•ã„ã€‚ Beautiful and Simple CSS Button Styling
izoc 2010/03/15
cssã§ãƒœã‚¿ãƒ³ãƒ‡ã‚¶ã‚¤ãƒ³å¤‰æ›´

tips

CSS

webãƒ‡ã‚¶ã‚¤ãƒ³
ãƒªãƒ³ã‚¯
CSSã§ãƒœã‚¿ãƒ³ã‚’ç¶ºéº—ã«ã‚¹ã‚¿ã‚¤ãƒ«ã™ã‚‹ã‚µãƒ³ãƒ—ãƒ«é›†:phpspoté–‹ç™ºæ—¥èªŒ
22 CSS Button Styling Tutorials and Techniques : Speckyboy Design Magazine CSSã§ãƒœã‚¿ãƒ³ã‚’ç¶ºéº—ã«ã‚¹ã‚¿ã‚¤ãƒ«ã™ã‚‹ã‚µãƒ³ãƒ—ãƒ«é›†ãŒ Speckyboy Design Magazine ã«ã¦ç´¹ä»‹ã•ã‚Œã¦ã„ã¾ã™ã€‚ ãªã‚“ã¨ã‚‚ç¾Žã—ã„ãƒœã‚¿ãƒ³ã®ã‚µãƒ³ãƒ—ãƒ«ãŒè‰²ã€…ã¨ç´¹ä»‹ã•ã‚Œã¦ã„ã¦ã€ã‚‚ã†ãƒœã‚¿ãƒ³ãƒ‡ã‚¶ã‚¤ãƒ³ã«è¿·ã†ã“ã¨ã¯ãªã„ã‹ã‚‚ã—ã‚Œã¾ã›ã‚“ã€‚ Submit button should look same everywhere ç¶ºéº—ãªã‚¢ã‚¤ã‚³ãƒ³ä»˜ãSubmitãƒœã‚¿ãƒ³ How to make sexy buttons with CSS è§’ä¸¸ã‚°ãƒ©ãƒ‡ãƒ¼ã‚·ãƒ§ãƒ³ä»˜ããƒœã‚¿ãƒ³ Scala ble CSS Buttons Using PNG and Background Colors æ–‡å—ã‚’é•·ãã—ã¦ã‚‚ä¼¸ç¸®ã™ã‚‹ãƒœã‚¿ãƒ³ CSS Overlapping Arrow Buttons éšŽ
izoc 2010/03/15
cssã§ãƒœã‚¿ãƒ³ãƒ‡ã‚¶ã‚¤ãƒ³å¤‰æ›´

tips

CSS

webãƒ‡ã‚¶ã‚¤ãƒ³
ãƒªãƒ³ã‚¯
CSS3ã§ã‚¯ãƒ¼ãƒ«ãªãƒœã‚¿ãƒ³ã‚’ä½œã‚‹ãƒãƒ¥ãƒ¼ãƒˆãƒªã‚¢ãƒ«é›†ã„ã‚ã„ã‚:phpspoté–‹ç™ºæ—¥èªŒ
20 CSS3 Tutorials and Techiques for Creating Buttons - Speckyboy Design Magazine CSS3ã§ã‚¯ãƒ¼ãƒ«ãªãƒœã‚¿ãƒ³ã‚’ä½œã‚‹ãƒãƒ¥ãƒ¼ãƒˆãƒªã‚¢ãƒ«é›†ãŒï¼’ï¼ç¨®é¡žã»ã©å…¬é–‹ã•ã‚Œã¦ã„ã¾ã™ã€‚ å®Ÿã«æ§˜ã€…ãªç¨®é¡žã®ãƒœã‚¿ãƒ³ä½œæˆãƒãƒ¥ãƒ¼ãƒˆãƒªã‚¢ãƒ«ãŒã‚ã£ã¦ã€CSS3ã§ãƒœã‚¿ãƒ³ã‚’ä½œã‚‹éš›ã«ã¯å›°ã‚‰ãªã„ã‹ã‚‚ã—ã‚Œã¾ã›ã‚“ãã€‚ ãƒ‡ã‚¶ã‚¤ãƒ³ã‚„å®Ÿè£…ã®ã—ã‚„ã™ã•ã€ãƒ¡ãƒ³ãƒ†ãƒŠãƒ³ã‚¹æ€§ãªã©ã‹ã‚‰é¸ã³ãŸã„ã§ã™ãã€‚ é–¢é€£ã‚¨ãƒ³ãƒˆãƒª CSSã§ãƒœã‚¿ãƒ³ã‚’ç¶ºéº—ã«ã‚¹ã‚¿ã‚¤ãƒ«ã™ã‚‹ã‚µãƒ³ãƒ—ãƒ«é›† CSSã§ã‚¯ãƒ¼ãƒ«ãªãƒœã‚¿ãƒ³ã‚’ä½œã‚‹ã¾ã¨ã‚ CSSã«ã‚ˆã‚‹ãƒœã‚¿ãƒ³ã‚¹ã‚¿ã‚¤ãƒªãƒ³ã‚°ä¾‹ã„ã‚ã„ã‚
izoc 2010/03/15
cssã§ãƒœã‚¿ãƒ³ãƒ‡ã‚¶ã‚¤ãƒ³å¤‰æ›´

tips

CSS

webãƒ‡ã‚¶ã‚¤ãƒ³
ãƒªãƒ³ã‚¯
1