«   2024/09   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30
Archives
Today
Total
09-23 05:22
관리 메뉴

DevTzu

[HTML/CSS] STARTING WITH HTML + CSS (번역) 본문

review

[HTML/CSS] STARTING WITH HTML + CSS (번역)

DevTzu 2010. 11. 10. 21:14
반응형

CSS tutorial
starting with HTML + CSS



This short tutorial is meant for people who want to start using CSS and have never written a CSS style sheet before.
이 짧은 튜토리어은 CSS 사용을 원하는 사람들과 CSS 스타일 시트를 사용한 적이 없는 사람들을 위한 것입니다.

It does not explain much of CSS. It just explains how to create an HTML file, a CSS file and how to make them work together. After that, you can read any of a number of other tutorials to add more features to the HTML and CSS files. Or you can switch to using a dedicated HTML or CSS editor,that helps you set up complex sites.
이것으로 많은 CSS를 설명할 수는 없다. 이것은 단지 HTML파일, CSS파일 그리고 그것들을 함께 어떻게 만드는지에 대한 방법을 설명합니다. 그 후, 당신은 HTML파일과 CSS파일의 많은 기능이 추가된 다수의 다른 튜토리얼을 읽을수 있습니다. 아니면 당신은 HTML or CSS 에디터 전용으로 사용할 수 있고, 복잡한 사이트를 설정하는데 도움을 줄 수 있습니다.

At the end of the tutorial, you will have made an HTML file that looks like this:
이 튜토리얼이 끝나면 당신은 아래 보이는거오 같이 HTML파일을 만들었을 것 입니다.

The resulting HTML page, with colors and layout, all done with CSS.
이 HTML page 결과는 colors, layout, CSS를 포함

STEP 1: WRITING THE HTML


For this tutorial, I suggest you use only the very simplest of tools. E.g., Notepad (under Windows), TextEdit (on the Mac) or KEdit (under KDE) will do fine. Once you understand the principles, you may want to switch to more advanced tools, or even to commercial programs, such as Style Master, Dreamweaver or GoLive. But for your very first CSS style sheet, it is good not to be distracted by too many advanced features.



Don't use a wordprocessor, such as Microsoft Word or OpenOffice. They typically make files that a Web browser cannot read. For HTML and CSS, we want simple, plain text files.




Step 1 is to open your text editor (Notepad, TextEdit, KEdit, or whatever is your favorite), start with an empty window and type the following:




<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
  <title>My first styled page</title>
</head>

<body>

<!-- Site navigation menu -->
<ul class="navbar">
  <li><a href="index.html">Home page</a>
  <li><a href="musings.html">Musings</a>
  <li><a href="town.html">My town</a>
  <li><a href="links.html">Links</a>
</ul>

<!-- Main content -->
<h1>My first styled page</h1>

<p>Welcome to my styled page!

<p>It lacks images, but at least it has style.
And it has links, even if they don't go
anywhere&hellip;

<p>There should be more here, but I don't know
what yet.

<!-- Sign and date the page, it's only polite! -->
<address>Made 5 April 2004<br>
  by myself.</address>

</body>
</html>


In fact, you don't have to type it: you can copy and paste it from this Web page into the editor.




(If you are using TextEdit on the Mac, don't forget to tell TextEdit that the text is really plain text, by going to the Format menu and selecting “Make plain text”.)























반응형
Comments