비디오: Drupal 2013 KOREA -드루팔에 대한 간단한 소개 및 드루팔 8의 중요한 변화들- 김규현대표주넥스트이온 2024
스타일. CSS 파일에는 Drupal 테마의 글꼴 색상, 스타일 및 크기에 대한 규칙이 들어 있습니다. 다음은 스타일로 볼 수있는 글꼴의 모양을 제어하는 데 사용되는 코딩의 일부입니다. css:
-
font:이 태그는 한 번만 스타일로 나타납니다. css를 지정하고 전체 사이트에 사용할 글꼴을 지정합니다.
-
font-size: 텍스트의 크기를 제어합니다.
-
font-weight: 텍스트를 굵게 설정하는 데 사용됩니다.
-
font-style: 주로 텍스트를 기울임 꼴로 설정하는 데 사용됩니다.
-
text-decoration: 링크에 밑줄을 표시할지 여부를 조정합니다.
-
color: 텍스트의 색을 설정합니다.
다음 코드 줄은 몇 가지 주요 텍스트 설정을 스타일로 보여줍니다. 당신이 바꿀 수도있는 CSS. : 76 % / 170 % Verdana, Arial, Helvetica, sans-serif; color: # 000000;}
이 행에서 두 가지 일이 진행되고 있습니다. 속성 색상은 전체 사이트의 텍스트 색상을 검정색으로 설정합니다. 다른 규칙이 나중에이 파일에서 색상을 변경하지 않으면 사이트에서 검은 색으로 나타납니다. 이 사양은 사이트 전체의 모든 콘텐츠 텍스트의 색을 제어합니다.
font: 100 % Times New Roman, Georgia, Serif;
다음 그림과 같이 전체 사이트의 글꼴을 변경합니다.
a {텍스트 장식: 없음; font-weight: bold;}
텍스트 장식은 사이트의 링크에 밑줄을 표시할지 여부를 제어합니다. 이 경우에는 그렇지 않습니다. font-weight는 사이트 링크를 굵게 표시합니다.
a: hover {text-decoration: underline;}
사이트의 링크 중 하나 위로 마우스 커서를 이동하면 밑줄이 나타납니다. 커서를 움직이면 사라집니다. 마우스를 올리면 커서가 무언가 위로 이동하여 거기에서 멈추는 것을 나타냅니다.
#branding {color: # 000;}
색상이 # 000으로 변경되면 색상이 검은 색이되고 노란색 배경에 더 잘 어울립니다.
CSS 코드를 변경할 때 구두점을 그대로 유지하십시오. 예를 들어, 코드 블록의 각 줄이 세미콜론으로 끝나야합니다.
팁 "> 시행 착오는 스타일의 스타일을 파악하는 한 가지 방법입니다.CSS는 귀하 사이트의 어떤 요소에 속해 있습니다. 그러나 쉬운 방법이 있습니다. Firefox 웹 브라우저를 사용하여 Firebug라는 추가 기능을 설치할 수 있습니다. 그렇게하면 웹 브라우저에서 창을 열어 웹 페이지의 요소가 사용하는 스타일을 보여줍니다.
다음 그림에서는 어떤 선 스타일을 볼 수 있습니다. CSS는 헤더에서 사이트 이름의 모양을 제어합니다. 브라우저의 오른쪽 하단에서 CSS 코드의 어디에 서식이 설정되어 있는지 확인할 수 있습니다. Getfirebug에서 Firebug에 대해 자세히 알아보십시오. com.
팁 "> 다른 많은 세부 사항을 조정할 수 있으며 테마를 수정할 수 있습니다. 드루팔 (Drupal). org / theme-guide는 매우 철저한 가이드입니다.