Html Manual

 

HTML-  (HTML5 standard) official introduction

HTML (English: HyperText Markup Language, referred to as: HTML) is a standard for creating a web page markup language.

You can use HTML to build their WEB site (we django), HTML run in the browser, to resolve by the browser.

In this tutorial, you will learn how to use HTML to create the site.

 

Learning website: https://www.runoob.com/html/html-basic.html

HTML

  1, a set of rules, the browser know the rules.

   2, Developer:

    Html learning rule


    Development Background:
      - Write Html files (acting as role templates) 
      - database to obtain data, and then replace the specified location html file (Web Framework)

  3, the local test
    - to find the file path, direct your browser to open
    - pycharm open test


  4, write Html files

    - doctype corresponding relationship
    - html tags, internal tags can write properties ====> can be only one
    - Comment: <- Content comment ->!
  5, classification label
    - self-closing tag
    <meta = charset "UTF-. 8">
    - active closing tags
    <title> Hello </ title>


  6, head tag
    - <meta -> encoding, jump, refresh, keywords, description, IE compatible
    <meta http-equiv = "X -UA-Compatible" content = "IE = IE9; IE = IE8;" / >
    - title tag

  7, body tags
    - icon, & nbsp; & gt; & lt;
    - P tag, a paragraph
  - br, newline
======== ===== small sum
of all tags are divided into:
block-level tags: div (white), H series (increase bold), (a distance between paragraphs and paragraphs) p tag
within the row labels: span (white)
can be nested between the tags
sense tags present, css operation, js operation

 

Use pycharm project templates -> folder, select Folder New helloWorld.html 

<! DOCTYPE HTML > 
< HTML lang = "EN" > 
< head > 
    < Meta charset = "UTF-8" > 
    < title > My first website </ title > 
</ head > 
< body > 
< h1 > I is div> ul> li unordered </ h1 > 
< div > 
    < ul > 
        < li > I am the ol a </ li > 
        <li > I am a B-ol</ Li > 
        < li > I'm ol of C </ li > 
        < li > I'm ol of D </ li > 
        < li > I'm ol of E </ li > 
    </ ul > 
</ div > 
< h1 > I div> ol> li orderly </ h1 > 
< div > 
    < ol > 
        < li > I am the ol a </ li > 
        < li >I was the ol B </ li> 
        < Li > I am the ol C </ li > 
        < li > I'm ol of D </ li > 
        < li > I am the ol E </ li > 
    </ ol > 
</ div >

<h2>我是表格</h2>
<table style="border: 1px solid #ccc">
    <tr>
        <td style="border: 1px solid #ccc">姓名</td>
        <td style="border: 1px solid #ccc">UM号</td>
        <td style="border: 1px solid #ccc">年龄</td>
        <td style="border:Solid #ccc 1px " </Post>td>
        <td style="border: 1px solid #ccc">创建时间</td>
    </tr>
    <tr>
        <td style="border: 1px solid #ccc">张三</td>
        <td style="border: 1px solid #ccc">ZHANGSAN</td>
        <td style="border: 1px solid #ccc">18</td>
        <td style="border: 1px solid #ccc">Siege lion </ TD > 
        < TD style = "border: 1px Solid #ccc" > 2019-11-13 09-03:. 17 </ TD > 
    </ TR > 
</ Table > 
< br > 
< H3 > I form </ h3 > 
< A href = "https://www.baidu.com" target = "_ blank" > Baidu, </ A > 
< br /> 
< h2 > I am a form </h2>
<form action="#">
    姓名:<input type='text' name="name" value="" placeholder="请输入姓名"/><br/>
    密码:<input type='password' name="password" value=""/><br/>


    性别:name属性(name相同则互斥)<br/>
    男:<input type='radio' value="男" checked="checked" name="sex"/><br/>
    女:<input type='radio' value="女" checked="checked" name="sex"/><br/>
    保密:<input type='radio' value="保密" checked="checked" name="sex"/><br/>
    爱好:name属性(批量获取数据)<br/>
    <input type='checkbox' value="西瓜" checked="checked" name="Hobby"/><br/>
    <input type='checkbox' value="苹果" checked="checked" name="Hobby"/><br/>
    <input type='checkbox' value="菠萝" checked="checked" name="Hobby"/><br/>
    <input type='checkbox' value="车厘子" checked="checked" name="Hobby"/><br/>
    开发语言:<br/>
    <select>
        <option value="C">C</option>
        <option value="C++">C++</option>
        <option value="Java">Java</option>
        <option value="C#">C#</option>
        <option value="Python" selected="selected">Python</option>
    </select>
    <br/>
    上传文件:<input type='file'/><br/>
    重置:<input type='reset' value="重置"/><br/>
    <textarea rows="20" cols="30"><>TextArea</Default
    br/>
    提交:<input type='submit' value='提交' style="width: 50px"/><br/>
    登录:<input type='button' value='登录' style="width: 70px"><br/>
</form>

<br/>
</body>
</html>

 

Guess you like

Origin www.cnblogs.com/wangcongxing/p/11846847.html