프로그램 작성 css

14

일부 프로젝트에서 멋진 글꼴을 사용하고 있지만 멋진 글꼴 아이콘으로 할 일이 있습니다. 다음과 같이 쉽게 아이콘을 호출 할 수 있습니다. <i class="fa fa-lock"></i> 모든 아이콘이 항상 테두리가있는 둥근 원 안에있을 수 있습니까? 이와 같은 사진이 있습니다. 사용 i { background-color: white; border-radius: 50%; border: 1x solid grey; padding: 10px; } …

134 css font-awesome

7

CSS 오버플로-한 줄의 텍스트

나는이 div다음 CSS 스타일로 : width:335px; float:left; overflow:hidden; padding-left:5px; div긴 줄의 텍스트 를 삽입 하면 새 줄로 바뀌어 모든 텍스트가 표시됩니다. 내가 원하는 것은 줄 바꿈되지 않는 한 줄의 텍스트 만 갖는 것입니다. 텍스트가 길면 넘쳐나는 텍스트가 사라지기를 원합니다. 높이 설정에 대해 생각하고 있었지만 잘못된 것 같습니다. 어쩌면 글꼴과 동일한 …

134 html css overflow

13

화면 중앙에 <div> 요소 배치

화면 크기에 관계없이 화면 중앙에 <div>(또는 <table>) 요소 를 배치하고 싶습니다 . 다시 말해 'top'과 'bottom'에 남은 공간이 동일해야하고 'right'와 'left'에 남은 공간이 동일해야합니다. CSS로만 이것을 수행하고 싶습니다. 다음을 시도했지만 작동하지 않습니다. <body> <div style="top:0px; border:1px solid red;"> <table border="1" align="center"> <tr height="100%"> <td height="100%" width="100%" valign="middle" align="center"> We are …

134 javascript css html

7

div의 중심에 가로 및 세로로 테이블을 배치하는 방법

이미지를 다음 <div>과 같은 배경 이미지로 설정할 수 있습니다 . <style> #test { background-image: url(./images/grad.gif); background-repeat: no-repeat; background-position: center center; width:80%; margin-left:10%; height:200px; background-color:blue; } </style> <div id="test"></div> <div>수평 및 수직 중심에 테이블을 설정해야합니다 . 를 사용하는 크로스 브라우저 솔루션이 CSS있습니까?

134 css

2

: 후 vs. :: 후

CSS 2.1 :after과 CSS 3 ::after의사 선택기 ( ::after구형 브라우저에서 지원되지 않는 것) 사이에는 기능상의 차이가 있습니까? 최신 사양을 사용해야하는 실질적인 이유가 있습니까?

134 css css-selectors pseudo-element pseudo-class

2

CSS 전용 벽돌 레이아웃

상당히 낡은 벽돌 레이아웃을 구현해야합니다. 그러나 여러 가지 이유로 JavaScript를 사용하여 원하지 않습니다. 매개 변수 : 모든 요소의 너비가 동일합니다 요소는 서버 측에서 계산할 수없는 높이를 갖습니다 (이미지와 다양한 양의 텍스트) 필요한 경우 고정 된 수의 열로 살 수 있습니다 현대적인 브라우저에서 작동이에 대한 사소한 해결책이 속성.column-count 해당 솔루션의 문제점은 …

134 html css flexbox css-grid

16

Bootstrap 4 카드를 카드 열에서 같은 높이로 만드는 방법은 무엇입니까?

저는 Bootstrap 4 alpha 2를 사용하고 있으며 카드를 활용하고 있습니다. 특히 공식 문서에서 가져온 이 예제 로 작업하고 있습니다. 모든 카드를 같은 높이로 만들려면 어떻게해야합니까? 지금까지 생각할 수있는 것은 다음 CSS 규칙을 설정하는 것뿐입니다. .card { min-height: 200px; } 그러나 이것은 일반적인 경우에는 작동하지 않는 하드 코딩 된 솔루션 일뿐입니다. …

134 html css twitter-bootstrap bootstrap-4 bootstrap-cards

14

HTML5 자리 표시 자 CSS 패딩

이 게시물을 이미 보았고 자리 표시 자의 패딩을 변경하기 위해 할 수있는 모든 것을 시도했지만 슬프게도 협력하고 싶지 않은 것 같습니다. 어쨌든, 여기 CSS 코드가 있습니다. ( 편집 : 이것은 sass에서 생성 된 CSS입니다) #search { margin-top: 1px; display: inline; float: left; margin-left: 10px; margin-right: 10px; width: 220px; } #search …

133 html google-chrome webkit css

6

CSS를 사용하여 텍스트를 늘릴 수 있습니까?

CSS에서 텍스트를 늘릴 수 있습니까? 글꼴이 더 커지는 것을 원하지 않습니다. 글꼴 옆의 작은 텍스트보다 더 굵게 표시되기 때문입니다. 텍스트를 세로로 늘려서 변형되었습니다. 이것은 하나의 div에 있고 그 옆의 일반 텍스트는 다른 div에 있습니다. 어떻게해야합니까?

133 css

3

CSS @ font-face-“src : local ( '☺')”은 무슨 뜻입니까?

@font-face처음 사용 하고 fontsquirrel에서 글꼴 키트를 다운로드했습니다. 그들이 내 CSS에 삽입하도록 권장하는 코드는 다음과 같습니다. @font-face { font-family: 'junctionregularRegular'; src: url('Junction-webfont.eot'); src: local('☺'), url('Junction-webfont.woff') format('woff'), url('Junction-webfont.ttf') format('truetype'), url('Junction-webfont.svg#webfontoNEpZXy2') format('svg'); } 이제, 웃는 얼굴이 엉망이되었습니다. 그러나 src의 URL 수도 마찬가지입니다. 왜 그렇게 많은 파일을 추천하고 페이지가 렌더링 될 때 모두 브라우저로 …

133 css font-face

1

Bootstrap은 왜 line-height 속성을 1.428571429로 설정합니까?

line-height: 1.428571429; 부트 스트랩line-height 이이 값으로 설정 되는 이유는 무엇 입니까? ( 일부 테마 는 1.42857143으로 반올림합니다.)

133 twitter-bootstrap css

6

부트 스트랩 3의 선택 태그에서 경계 반경 제거

이것은 사소한 문제처럼 보이지만 알아낼 수는 없습니다. Bootstraps 자체 웹 사이트에는 Select 예제가 있습니다. 코드를 보면 해당 선택 요소에 테두리 반경이 4 인 것처럼 보입니다. 테두리 반경을 0으로 변경하면 선택 요소에서 테두리 반경이 제거되지만 아래 그림과 같이 그렇지 않습니다. 선택 요소를 변경하는 모든 CSS를 살펴 보았지만 테두리 반경을 제거하지 않는 …

133 css twitter-bootstrap

2

슬래시가있는 CSS의 글꼴 크기

슬래시의 의미는 다음과 같습니다. font: 100%/120%;

133 html css size

10

jQuery를 사용하여 CSS를 변경하는 방법?

jQuery를 사용하여 CSS를 변경하려고합니다. $(init); function init() { $("h1").css("backgroundColor", "yellow"); $("#myParagraph").css({"backgroundColor":"black","color":"white"); $(".bordered").css("border", "1px solid black"); } <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> <div class="bordered"> <h1>Header</h1> <p id="myParagraph">This is some paragraph text</p> </div> 코드 스 니펫 실행결과 숨기기스 니펫 확장 내가 여기서 무엇을 놓치고 있습니까?

133 javascript jquery css

15

CSS를 사용하여 '필수 필드'별표를 자동으로 추가하여 입력 구성

이 코드가 원하는대로 작동하지 않는다는 불행한 사실을 극복하는 좋은 방법은 무엇입니까? <div class="required"> <label>Name:</label> <input type="text"> </div> <style> .required input:after { content:"*"; } </style> 완벽한 세계에서, 모든 필수 input는 필드가 필요하다는 것을 나타내는 작은 별표를 얻을 것입니다. CSS는 요소 자체 다음이 아닌 요소 내용 뒤에 삽입되므로 불가능합니다. 필수 필드 수천 …

133 css forms validation standards

«css» 태그된 질문