博客列表 >HTML入门学习第一天

HTML入门学习第一天

若水的博客
若水的博客原创
2018年05月27日 14:52:04549浏览

一、站点建立

作用:用来归纳一个网站上所有的网页,素材以及他们之间的联系。

站点根目录命名规则:必须是以字母和下划线开头,后面数字和下划线,不可以使用中文。


二、创建HTML页面

首页名称必须是:index.html

三、HTML5页面结构

<!doctybe html>                                                                <!--这里是注释:申明文本为HTML文本-->

<html>                                                                                     <!--HTML起始    开始标签-->

<head>                                                                                         <!--HTML, 文件头部-->

<meta charsrt="utf-8"/>                                                           <!--HTML,申明字符集 utf-8-->

<title>我的第一个 HTML 页面</title>                                             <!--网页标题-->

</head>                                                                                 <!--HTML, 文件头部结束标签-->

<body> 

                                                                                                        <!--HTML, 文件主体-->

</body>

</html>                                                                                                  <!--HTML结尾   结束标签-->

四、HTML基本语法

常规语法:

<标记 属性=“属性值”  属性=“属性值”>内容</标记>

空标记语法:没有结束标记的标记 

<标记 属性=“属性值”/>                                                                <!--没有结束标签“</标记>”的标记-->


说明:

1、写在尖角号里的第一个单词叫标记, 也称标签,还可以称为元素。

2、标记和属性之间用空格隔开,属性和属性值之间用等号连接,属性值必须放在双引号内。

3、当一个标记有多个的时候,属性和属性用空格隔开,属性和属性不分先后顺序。


五、HTML核心元素

1、文本标题

<h1>一级标题</h1>                     最大

<h2>二级标题</h2>

<h3>三级标题</h3>

。。。。                                        h4-h5省略

<h6>六级标题</h6>                    最小

2、段落

<p>段落文字</p>

3、空格

&nbsp;

4、加粗

 <b>加粗文本</b>

<strong>加粗文本</strong>

5、强制换行

<br/>

6、倾斜

<i>倾斜文本</i>

<em>倾斜文本</em>

7、列表

无序列表语法

<ul>

        <li>列表项内容<li>

        <li>列表项内容<li>

        <li>列表项内容<li>

...........

</ul>

有序列表语法

<ol>

        <li>列表项内容<li>

        <li>列表项内容<li>

        <li>列表项内容<li>

............

</ol>

自定义列表语法

<dl>

        <dt>名词</dt>

        <dd>名词解释</dd>

</dl>

8、超链接

<a href="目标文件的路径及全称">连接文本</a>              <!--“ ../” 返回上一个文件夹-->

9、图片

<img src="目标文件路径及全称"/>

10、水平线

<hr/>

11、div             布局页面区块   没有明确语义需要结合CSS写

12、span        内联元素,给文本做效果, 没有明确语义,后期学习





声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议