«css» 태그된 질문

CSS (Cascading Style Sheets)는 HTML (HyperText Markup Language), XML (Extensible Markup Language) 문서 및 색상, 레이아웃, 글꼴 등을 포함한 SVG 요소의 모양과 형식을 설명하는 데 사용되는 표현 스타일 시트 언어입니다. 애니메이션. 또한 화면, 종이, 연설 또는 기타 미디어에서 요소를 렌더링하는 방법에 대해서도 설명합니다.

3
버튼 또는 필드 셋 요소에서 작동하지 않는 Flex / Grid 레이아웃
나는- <button>태그 의 내부 요소 를 flexbox의 justify-content: center. 그러나 Safari는 그들을 중심에 두지 않습니다. 다른 태그에 동일한 스타일을 적용 할 수 있으며 의도 한대로 작동합니다 ( <p>-tag 참조 ). 버튼 만 왼쪽 정렬됩니다. Firefox 또는 Chrome을 사용하면 차이를 확인할 수 있습니다. 덮어 써야하는 사용자 에이전트 스타일이 있습니까? 아니면이 문제에 …
91 html  css  safari  flexbox  css-grid 
8
마우스 오버 후 마우스 아웃시 애니메이션을 반전하는 방법
따라서 마우스 아웃시 다음과 같은 리버스 애니메이션이 가능합니다. .class{ transform: rotate(0deg); } .class:hover{ transform: rotate(360deg); } 그러나 @keyframes 애니메이션을 사용할 때 작동하지 못했습니다. 예 : .class{ animation-name: out; animation-duration:2s; } .class:hover{ animation-name: in; animation-duration:5s; animation-iteration-count:infinite; } @keyframe in{ to {transform: rotate(360deg);} } @keyframe out{ to {transform: rotate(0deg);} } 반복과 애니메이션 …
91 css  animation 
6
iOS 입력 그림자 제거
iOS (Safari 5)에서 입력 요소 (상단 내부 그림자)를 따라야합니다. 상단 그림자를 제거하고 싶은데 버그 -webkit-appearance가 저장되지 않습니다. 현재 스타일은 다음과 같습니다. input { border-radius: 15px; border: 1px dashed #BBB; padding: 10px; line-height: 20px; text-align: center; background: transparent; outline: none; -webkit-appearance: none; -moz-appearance: none; }
91 ios  css  input 
6
플렉스 컨테이너를 가운데에 맞추고 플렉스 아이템을 왼쪽 정렬하는 방법
플렉스 항목이 중앙에 배치되기를 원하지만 두 번째 줄이있을 때 5 (아래 이미지에서)가 1 아래에 있고 부모의 중앙에 배치되지 않도록합니다. 내가 가지고있는 것의 예는 다음과 같습니다. ul { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; } li { list-style-type: none; border: 1px solid gray; margin: 15px; …
91 html  css  flexbox 
10
플렉스 컨테이너의 동일한 높이 행
보시다시피 list-items첫 번째 row는 동일한 height. 그러나 두 번째 항목 row은 다릅니다 heights. 모든 항목에 유니폼을 입히고 싶습니다 height. 고정 높이 를 제공하지 않고 flexbox 만 사용하여 이것을 달성하는 방법이 있습니까? 여기 나의 code .list { display: flex; flex-wrap: wrap; max-width: 500px; } .list-item { background-color: #ccc; display: flex; padding: …
91 html  css  flexbox 
7
<head>에서 요소를 주문하는 모범 사례는 무엇입니까?
어떤 순서로든 사용할 수 있습니까? &lt;meta http-equiv="Content-Type" content="text/html;charset=UTF-8"&gt;전에 배치하는 것이 중요 합니까&lt;title&gt; 이것이 가장 많이 사용됩니다. 가장 좋은 방법입니까? &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta http-equiv="content-type" content="text/html; charset=utf-8"&gt; &lt;title&gt;Title Goes Here&lt;/title&gt; &lt;link rel="stylesheet" href="http://sstatic.net/so/all.css?v=5912"&gt; &lt;link rel="shortcut icon" href="http://sstatic.net/so/favicon.ico"&gt; &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; $(function() …
91 html  css  xhtml  w3c 
9
CSS로 원하지 않는 표 셀 테두리 제거
특이하고 실망스러운 문제가 있습니다. 간단한 마크 업의 경우 : &lt;table&gt; &lt;thead&gt; &lt;tr&gt;&lt;th&gt;1&lt;/th&gt;&lt;th&gt;2&lt;/th&gt;&lt;th&gt;3&lt;/th&gt;&lt;/tr&gt; &lt;/thead&gt; &lt;tbody&gt; &lt;tr&gt;&lt;td&gt;a&lt;/td&gt;&lt;td&gt;b&gt;&lt;/td&gt;&lt;td&gt;c&lt;/td&gt;&lt;/tr&gt; &lt;tr class='odd'&gt;&lt;td&gt;x&lt;/td&gt;&lt;td&gt;y&lt;/td&gt;&lt;td&gt;z&lt;/td&gt;&lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; thead , tr 및 tr 홀수 요소에 다른 배경색 값을 적용 합니다. 문제는 대부분의 브라우저에서 모든 셀에 테이블 행의 색상이 아닌 원하지 않는 테두리가 있다는 것입니다. Firefox 3.5에서만 표의 셀에 테두리가 …
91 html  css  html-table 
6
Twitter Bootstrap을 사용하여 테이블 셀에서 세로로 버튼 중앙에 배치
Twitter Bootstrap을 사용하고 있으며 테이블 셀 내부에 버튼을 배치하려고합니다. 나는 그것이 수직으로 중앙에 있어야만합니다. &lt;table class="table table-bordered table-condensed"&gt; &lt;tbody&gt; &lt;tr&gt; &lt;td&gt;&lt;a href="#" class="btn btn-primary"&gt;&lt;i class="icon-check icon-white"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/td&gt; &lt;td&gt;&lt;a href="#"&gt;Todo Item One&lt;/a&gt;&lt;br /&gt;&lt;span class="label label-success"&gt;One thing&lt;/span&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; 문제에 대해서는 내 JSFiddle 을 참조하십시오 . 내가 아는 테이블 센터링 트릭을 여러 …
10
Twitter 부트 스트랩을 사용하여 자동으로 경고를 닫는 방법
나는 트위터의 부트 스트랩 CSS 프레임 워크 (환상적이다)를 사용하고있다. 사용자에게 보내는 일부 메시지의 경우 Javascript JS 및 CSS 경고를 사용하여 표시하고 있습니다. 관심있는 사람들은 여기에서 찾을 수 있습니다 : http://getbootstrap.com/javascript/#alerts 내 문제는 이것입니다. 사용자에게 경고를 표시 한 후 일정 시간 간격이 지나면 사라지기를 원합니다. 트위터의 문서와 내가 살펴본 코드에 따르면 …
11
Google의 Imageless 버튼
최근 Google의 새로운 이미지없는 버튼에 대한 몇 가지 기사가 있습니다. http://stopdesign.com/archive/2009/02/04/recreating-the-button.html http://stopdesign.com/eg/buttons/3.0/code.html http://stopdesign.com/eg/buttons/3.1/code.html http://gmailblog.blogspot.com/2009/02/new-ways-to-label-with-move-to-and-auto.html 이 새로운 버튼이 Gmail에서 작동하는 방식이 정말 마음에 듭니다. 내 사이트에서 이러한 또는 유사한 버튼을 어떻게 사용할 수 있습니까? 비슷한 모양과 느낌의 오픈 소스 프로젝트가 있습니까? JQuery / XHTML / CSS를 사용하여 이와 같은 내 버튼 …
14
CSS를 사용하여 Div를 2 개의 열로 분할
CSS를 사용하여 div를 두 개의 열로 분할하려고 시도했지만 아직 작동하지 않았습니다. 내 기본 구조는 다음과 같습니다. &lt;div id="content"&gt; &lt;div id="left"&gt; &lt;div id="object1"&gt;&lt;/div&gt; &lt;div id="object2"&gt;&lt;/div&gt; &lt;/div&gt; &lt;div id="right"&gt; &lt;div id="object3"&gt;&lt;/div&gt; &lt;div id="object4"&gt;&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; 오른쪽 및 왼쪽 div를 각각의 위치 (오른쪽 및 왼쪽)로 플로팅하려고하면 콘텐츠 div의 배경색을 무시하는 것 같습니다. 그리고 …
90 css  html  css-float 
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.