■HTML 기본 작성법

  • HTML5 문서는 반드시 <!DOCTYPE html>로 시작하여 문서 형식을 HTML5로 지정한다.
  • 실제적인 HTML 문서는 <html>과 </html> 사이에 기술한다.
  • <head>와 </head> 사이에는 문서 제목, 외부 파일 참조, 메타데이터의 설정 등을 기술한다.
  • 웹브라우저에 보여지는 모든 요소는 <body>와 </body> 사이에 기술한다.

[코드]

<!DOCTYPE html>
<html>
	<head>
    	<meta charset="utf-8">
        <title>Hello World</title>
    </head>
    <body>
    	<h1>Hello World</h1>
        <p>안녕하세요! HTML5</p>
    </body>
</html>

[결과]

Hello World

Hello World

안녕하세요! HTML5

 

■작성시 추천 에디터

  • HTML 문서는 .html 확장자를 갖는 순수 텍스트 파일이다.
  • 메모장으로도 편집 가능하지만, 에디터를 사용하면 다양한 편의 기능을 제공받을 수 있다.
  • 추천 에디터는 다음과 같다.
    • Visual Studio Code(플러그인 풍부하고, 가벼우므로 주류이다.)
    • WebStorm
    • Atom
    • Brackets
    • Sublime text

■HTML 기본 문법

  1. 요소(Element) : HTML의 요소에는 시작과 종료 태그와 그 사이에 위치한 콘텐츠로 구성되며, HTML 문서는 요소들의 집합으로 구성된다.
    1. 요소의 중첩(Nested Element)
      • 요소는 다른 요소를 포함 가능한데, 이 때에 중첩 관계가 성립된다.
      • 중첩 관계를 통해, 정보의 구조화와 문서의 구조 표현이 가능하다.
      • 중첩 관계를 파악하기 쉽도록, 들여쓰기(Indent)를 활용해야 한다.
    2. 빈 요소(Empty Element)
      • 콘텐츠를 가질 수 없고, 필요도 없는 요소를 빈 요소라 한다.
      • 대표적인 빈 요소
        • br : 줄 바꿈
        • hr : 수평선
        • img : 이미지
        • input : 유저로부터 정보를 수용
        • link : 해당 HTML 문서와 외부 리소스의 관계를 정의
        • meta : 해당 HTML 문서의 메타데이터를 기술
  2. 속성(Attribute) : 요소는 속성을 가질 수 있는데 이는 요소의 성질, 특징을 정의하는 명세이며, 요소에 추가적인 정보를 제공한다. ex) <img src="html.jpg" width="104" height="142"> = <태그 속성명="속성값" ...>
    1. 글로벌 속성(HTML Global Attribute)
      • 대체로 모든 HTML 요소에게 공통적으로 사용 가능한 속성이다.
      • 대표적인 글로벌 속성
        • id : 중복 지정이 불가능한 유일한 식별자를 요소에 지정한다.
        • class : 중복 지정이 가능하고 스타일시트에 정의된 class를 요소에 지정한다.
        • hidden : CSS의 hidden과는 다르게 의미상으로도 브라우저에 노출되지 않는다.
        • lang : 검색엔진의 크롤링 시, 웹페이지의 언어가 인식 가능하도록, 지정된 요소의 언어를 지정한다.
        • style : 요소에 인라인 스타일을 지정한다.
        • tabindex : 유저가 키보드로 페이지를 내비게이션 시, 이동 순서를 지정한다.
        • title : 요소의 제목을 지정한다.
  3. 주석 : 개발자에게 코드를 설명하는 것이 목적이며, 브라우저 화면에는 표시되지 않는다. ex) <!--주석-->

출처 : https://poiemaweb.com/html5-syntax

 

HTML5 Introduction & Syntax | PoiemaWeb

HTML (HyperText Markup Language)은 웹페이지를 기술하기 위한 마크업 언어이다. 조금 더 자세히 말하면 웹페이지의　내용(content)과 구조(structure)을 담당하는 언어로써 HTML 태그를 통해 정보를 구조화하

poiemaweb.com

 

반응형
저작자표시

'■　웹 개발 > HTML' 카테고리의 다른 글

웹페이지 구성에 관한 태그  (0) 2022.06.27
시맨틱 웹(Semantic Web)이란?  (0) 2022.06.20
HTML이란?  (0) 2022.06.17
웹 컴포넌트란?  (0) 2020.11.10
DOM이란?  (0) 2020.11.09

■개요

LINQ(Language INtergrated Query : 통합 언어 쿼리)는 복수의 데이터에서 조건에 맞는 데이터를 간추린 데이터들을 얻을 수 있도록 해주는 C#의 문법으로, .Net Framework 3.5부터 도입되었다고 한다.

 

■샘플코드

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

namespace HelloWorldCore
{
    /// <summary>
    /// 학생 클래스
    /// </summary>
    class Student
    {
        public string name { get; set; }
        public int age { get; set; }
        public int grade { get; set; }
    }

    /// <summary>
    /// Linq 사용법
    /// </summary>
    class LinqPractice
    {
        private int studentNumber = 5;
        private string[] studentNames = { "홍길동", "황진이", "이순신", "장영실", "정약용" };
        private int[] studentAges = { 25, 26, 25, 30, 40 };
        private int[] studentGrades = { 4, 4, 4, 2, 1 };

        // 학생 리스트
        List<Student> students = new List<Student>();

        public LinqPractice()
        {
            CreateStudents();
        }
        private void CreateStudents()
        {
            // 학생 객체를 생성하여 학생 리스트에 추가한다.
            for (int i = 0; i < studentNumber; i++)
            {
                Student student = new Student();
                student.name = studentNames[i];
                student.age = studentAges[i];
                student.grade = studentGrades[i];

                students.Add(student);
            }
        }

        /// <summary>
        /// LINQ구문은 from ~ where ~ select 순서로 작성한다.
        /// LIST, DataSource, Database, Collection, Array등을 LINQ로 사용할 수 있다.
        /// from, where, order by, select, group by, join등의 구문을 사용할 수 있다.
        /// </summary>
        public void TestLinq()
        {
            // 20대 학생만을 조회하여 얻어오는 Linq구문
            var Twenty_Student = from _student in students
                                 where _student.age >= 20 && _student.age < 30
                                 orderby _student.age ascending
                                 select _student;

            // 30대 학생만을 조회하여 얻어오는 Linq구문
            var Thirty_Student = from _student in students
                                 where _student.age >= 30 && _student.age < 40
                                 orderby _student.age ascending
                                 select _student;

            foreach(var Student in Twenty_Student)
            {
                Console.WriteLine("20대 학생은 = {0} 입니다.", Student.name);
            }

            Console.WriteLine();

            foreach (var Student in Thirty_Student)
            {
                Console.WriteLine("30대 학생은 = {0} 입니다.", Student.name);
            }
        }
    }
}

 

 

■참조

afsdzvcx123.tistory.com/entry/C-LINQ-%EC%86%8C%EA%B0%9C-%EB%B0%8F-%EC%82%AC%EC%9A%A9%EB%B2%95

 

[C#] LINQ 소개 및 사용법

이번 포스팅에서는 C# 문법 중 하나인, LINQ에 대해 알아보도록 하겠습니다. LINQ란 Language-Intergreated Query의 약자?로써, .NET Framework 버전 3.5부터 도입이 되었습니다. 그냥 쉽게 간단히 얘기해 C#에서..

afsdzvcx123.tistory.com

 

반응형
저작자표시

'■　프로그래밍 언어 > C#' 카테고리의 다른 글

WPF  (0) 2021.03.17
pdb 파일  (0) 2021.03.15
비동기처리1 - Thread, Task  (0) 2021.01.07
DLL이란?  (0) 2020.12.09

+ Recent posts

티스토리툴바