吾爱破解 - 52pojie.cn

 找回密码
 注册[Register]

QQ登录

只需一步,快速开始

查看: 4683|回复: 17
收起左侧

[其他转载] 新人刚刚开始学习html和css的笔记

[复制链接]
公子语凉 发表于 2018-2-28 12:01
新人刚刚开始学习html

大神请略过。

如果有什么错误请告诉我(毕竟是新人可能会存在很多问题)

欢迎大家一起学习和指教。

我做成了网页格式 (请忽略我小白的思想)

[HTML] 纯文本查看 复制代码
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>HTML5入门</title>
	</head>
	<body>
		我的第一张网页
		<hr />
		<hr />
		<hr />
		<hr />
		<hr />
		<h1>HTML5入门:</h1>
		<h2>一:什么是HTML:</h2>
		<p>HTML(全称:HyperText Markup Language 超文本标记语言),用来编写网页的</p>
		<pre>
			网页的组成:
			1:html		定义网页的结构和内容
			2:css		定义网页的外观
			3:javascr	定义网页的行为
			注:在浏览器上“右键”选择“查看网页源代码”,你可以看见的就是网页源代码,里面包含html+css+js等
		</pre>
		<h2>二:HTML历史:</h2>
		<p>从1991年TIm-Berners Lee(蒂姆.伯纳斯-李)发明,在1993年开始发布。</p>
		<p>由W3C(www.w3.rog)组织负责维护</p>
		<pre>
			HTML1.x		1993年6月
			HTML2.0		1995年11月
			HTML3.2		1997年1月
			HTML4.0		1997年12月
			HTML4.01	1999年(经典版本,所有浏览器都支持)
			HTML5.0		2014年10月
			HTML5.1		2016年11月(当前所学)
			注:
			XHTML		2000年1月发布,到XHTML2.0夭折。(没人使用)
		</pre>
		<h2>三:开发工具介绍:</h2>
		<pre>
			1:文本编辑工具:
				a:以记事本(notepad)为代表的等简单的文本编辑工具:
					如:editplus,notepad++,ultraEdit,sublime,Text两大神器(Emacs和VIM)等。
				b:集成开发工具:
					如:HBuilder,Webstorm,Eclipse等。
			2:网页浏览器(需支持html5)
				a:基于Trident内核的浏览器。
					如:Microsoft的Internet Explorer 9+(IE)或Microsoft Edge
				b:基于webkit内核的浏览器。
					如:Google的chrome,360的360chrome浏览器,苹果公司的Safari浏览器,Opera(Opera)等。
				c:基于Gecko内核的浏览器。
					如:Mozilla的Firefox(FF)。
		</pre>
		<h2>四:HTML编写须知:</h2>
		<pre>
			1:HTML编写(.html文件)
				我们可以用任何文本编辑工具编写符合html语法的网页
			2:浏览器的选择
				网页是由浏览器来读入后进行解析,然后窗口中渲染出来(我们在html中写一个<button>,浏览器就绘制一个按钮)
				注:不同的浏览器打开同一个网页,渲染出的效果不一样(甚至还会变形)原因是不同的浏览器拥有不同的内核(渲染网页的程序)规则不一样,结果就不一样。
		</pre>
	</body>
</html>
<!--
	HTML5入门:
	一:什么是HTML:
		HTML(全称:HyperText Markup Language 超文本标记语言),用来编写网页的
		网页的组成:
			1:html		定义网页的结构和内容
			2:css		定义网页的外观
			3:javascr	定义网页的行为
		注:在浏览器上“右键”选择“查看网页源代码”,你可以看见的就是网页源代码,里面包含html+css+js等
	
	
	二:HTML历史:
		从1991年TIm-Berners Lee(蒂姆.伯纳斯-李)发明,在1993年开始发布。
		由W3C(www.w3.rog)组织负责维护
		
		HTML1.x		1993年6月
		HTML2.0		1995年11月
		HTML3.2		1997年1月
		HTML4.0		1997年12月
		HTML4.01	1999年(经典版本,所有浏览器都支持)
		HTML5.0		2014年10月
		HTML5.1		2016年11月(当前所学)
		注:
		XHTML		2000年1月发布,到XHTML2.0夭折。(没人使用)
	
	
	三:开发工具介绍:
		1:文本编辑工具:
			a:以记事本(notepad)为代表的等简单的文本编辑工具:
				如:editplus,notepad++,ultraEdit,sublime,Text两大神器(Emacs和VIM)等。
			b:集成开发工具:
				如:HBuilder,Webstorm,Eclipse等。
		2:网页浏览器(需支持html5)
			a:基于Trident内核的浏览器。
				如:Microsoft的Internet Explorer 9+(IE)或Microsoft Edge
			b:基于webkit内核的浏览器。
				如:Google的chrome,360的360chrome浏览器,苹果公司的Safari浏览器,Opera(Opera)等。
			c:基于Gecko内核的浏览器。
				如:Mozilla的Firefox(FF)。
				
	
	四:HTML编写须知:
		1:HTML编写(.html文件)
			我们可以用任何文本编辑工具编写符合html语法的网页
		2:浏览器的选择
			网页是由浏览器来读入后进行解析,然后窗口中渲染出来(我们在html中写一个<button>,浏览器就绘制一个按钮)
			注:不同的浏览器打开同一个网页,渲染出的效果不一样(甚至还会变形)原因是不同的浏览器拥有不同的内核(渲染网页的程序)规则不一样,结果就不一样。
			
-->

免费评分

参与人数 2吾爱币 +2 热心值 +2 收起 理由
大象在思考 + 1 + 1 谢谢@Thanks!
Onlookers_汐颜 + 1 + 1 用心讨论,共获提升!

查看全部评分

发帖前要善用论坛搜索功能,那里可能会有你要找的答案或者已经有人发布过相同内容了,请勿重复发帖。

殇-No.1 发表于 2018-2-28 12:14
我看视频教程,看了几天,到表格等各种代码那里,就没兴趣看了,各种代码,用鸡肠字来描述,记住了这个词,忘记了那个词,记住了那个词,忘记了这个词…………
gentiana 发表于 2018-2-28 16:15
前端那些标签啊, 语法啊, 能看懂知道有这个功能就行吧, 不用背也不用记, 能百度到就好, 多练习用的久了就自然而然记住了.
看视频的时候要想想这个视频适不适合我, 是不是有效率, 这种学习方法适不适合我, 有没有更好的方式学习.
最后, 多动手练习
 楼主| 公子语凉 发表于 2018-2-28 12:02
<!DOCTYPE html>
<html>
        <head>
                <meta charset="UTF-8">
                <title>HTML5标签语法</title>
        </head>
        <body>
                <p>
                        我是纯文本。
                        <button>我是按钮</button>
                        我
                        是
                        纯
                        文
                        本
                        我<br />
                        是<br />
                        纯<br />
                        文<br />
                        本<br />
                        <hr />
                        语法练习:
                        <br />
                        Hello world!&gt;&gt;This is my first html5 webpage &lt;!--我是注释标签--&gt;&amp;nbsp;转义为一个空格
                </p>
                <hr />
                <hr />
                <hr />
                <hr />
                <hr />
                <h1>HTML5标签语法:</h1>
                <h2>一:文档类型:(DOCTYPE)</h2>
                <pre>
                        写在网页的第一行,告诉浏览器本网页遵循的规范
                        html5的写法
                                &lt;!DOCTYPE html&gt;
                        其它html版本的写法参考w3c
                </pre>
                <h2>二:HTML标签语法</h2>
                <pre>
                        HTML主要由标签(tag)相互嵌套组成
                        1:tag的语法两种:
                                a:&lt;标签名&gt;...内容...&lt;/标签名&gt;        标准标签的写法
                                        如:&lt;div&gt;..内容..&lt;/div&gt;                &lt;span&gt;..内容..&lt;/span&gt;
                                b:&lt;标签名 &gt;                                        空标签简写写法
                                        如:&lt;meta /&gt;        简写:&lt;meta&gt;                &lt;br /&gt;        简写:&lt;br&gt;
                        注:
                                a:所有标签名小写,我们仅能使用W3C定义的那些标签(标签名不能乱写)
                                b:标签总是成对出现(即写了开始标签一定要写结束标签)
                                c:有些标签在网页中可以使用多次,有的仅能使用1次
                                d:没有标签内容的标签称为空标签,可以简写
                        2:特殊别的标签:注释标签
                                浏览器不进行解析(忽略)用于描述作者的意图
                </pre>
                <h2>三:标签内容:</h2>
                <pre>       
                        1:标签内容两种:
                                纯文本
                                子标签
                        2:不同的标签其标签内容是不一样的
                                a:有的仅能包含纯文本的
                                        如:&lt;title&gt;我的内容仅能是纯文本&lt;/title&gt;
                                b:有的只能包含子标签的
                                        如:&lt;html&gt;        &lt;head&gt;
                                c:还有既可以包含纯文本也可以包含子标签的
                                        如:&lt;body&gt;        &lt;div&gt;
                        注:标签内容中的多个空白字符浏览器解析为一个空格字符       
                </pre>
                <h2>四:标签嵌套和结构:</h2>
                <pre>
                        1:根标签,父标签,直接父标签
                                html是网页的根标签
                                html是head和body和title,meta的父标签
                                html是head和body的直接父标签
                                head是title的直接父标签
                        2:子标签,直接父标签,兄弟标签
                                title和head和body都是html的子标签
                                head和body是html的直接子标签
                                head和body是兄弟标签
                                meta和title也是兄弟标签
                </pre>
                <h2>五:转义字符:</h2>
                <pre>
                        1:标签内容中的纯文本如果要显示以下几种字符,需要转义:
                                小于&lt;                                &amp;lt;
                                大于&gt;                                &amp;gt;
                                &amp;                                        &amp;amp;
                                空格                                        &amp;nbsp;
                                版权符号        &copy;                        &amp;copy;
                </pre>
        </body>
</html>
memory947 发表于 2018-2-28 12:38
对于代码个人是非常头疼,坚持不下去
RyzeN 发表于 2018-2-28 12:43
支持楼主
唯一丶 发表于 2018-2-28 13:04
建议使用Word或者Markdown来做笔记
cwhello 发表于 2018-2-28 15:16
我也是新手刚开始学习,白天上班,晚上回去看视频,楼主这是学习到哪里了呢?
wang13303578614 发表于 2018-2-28 16:40
LZ能分享下视屏资源吗?因为我是小白,想一起学习这个。
胖胖的胖子 发表于 2018-4-11 22:57
逛论坛看见了,虽然你写的那是灰常基础呀,给你支持下,坚持下去。
您需要登录后才可以回帖 登录 | 注册[Register]

本版积分规则

返回列表

RSS订阅|小黑屋|处罚记录|联系我们|吾爱破解 - LCG - LSG ( 京ICP备16042023号 | 京公网安备 11010502030087号 )

GMT+8, 2024-11-15 21:09

Powered by Discuz!

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表