复习上学期的HTML+CSS（1）
自己跟着网上教程复习上学期的HTML+CSS，因为已经忘得差不多了，而且现在学的js也要以HTML+CSS为基础，坚持每天持续更新。
n B/S 网络结构
Browser/Server 浏览器/服务器，这是现在最流行的网络模式。如新浪网、凤凰网等。
C/S Client/Server 客户端/服务器。最关键的地方，在自己电脑上安装一个客户端软件，通过客户端访问服务器。QQ
n HTML 简介
HTML Hypertext Markup Language 超文本标注语言。
HTML是一种规范，是一种标准，编写网页的一种标准。
超文本：就是网页上不光有文本，还有图片、音乐、视频等。
标注：是一种记号，是一种标志。如：红绿灯。
语言：这里的“语言”就是代码，跟所谓“程序语言”一点关系都没有。
HTML的主要目的：就是用来显示网页的不同效果，不同部分。如：<b>文本</b>
n HTML文件结构
<html>
<head>
<title>新浪首页</title>
</head>
<body>
网页正文··、、、、、、
</body>
</html>
HTML文件结构的说明
l <html></html>标记的含义：告诉浏览器，其中的代码用什么格式（图片、视频）来编译。
l <head></head>标记的含义：告诉浏览器，网页中的汉字用什么字符集（GB2312、BIG5、JIS）显示。不使用正确的字符集，网页会出现乱码。GB2312（简体中文）、BIG5（繁体中文）、JIS（日文）、utf-8（多国语言）
l <title></title>中只能是纯文本，任何标记都会原封不动的显示。
l <body></body>是网页主要内容的显示区域，网页中99%的内容都必须放在<body>中，最终浏览器翻译以后，才能看见结果。
l 功能：告诉浏览器，如何翻译汉字
l Content-type：内容类型
l Control：详细内容类型介绍
l Text/html：网页是text格式，html是文本中的小格式
l Charset：字符集，主要控制汉字如何显示
l Utf-8：多国语言编码，什么国家的语言都可以正常显示
n HTML标签格式
HTML标记，大致分两类：（1）双边标记；（2）单边标记
1、 双边标记
双边标记，是指有开始和结束标记，内容放在开始和结束标记之间。如：<b>内容</b>
语法格式：<标签 属性1=“值1” 属性2=“值2”>内容</标签>
“属性”的理解：人的特征（属性）有身高=170cm、体重=70KG、姓名=张三
2、 单边标记
单边标记，只有开始标记，而没有结束标记，单边标记一般是没有内容。如：<br />
单边标记一般起一个特殊的功能。
单边标记常用的有10多个标记。
语法格式：<标签 属性1=“值1” 属性2=“值2” />
n HTML标签编写规范
l HTML标记不区分大小写。如：<font>=<Font>=<fOnt>
l HTML标记属性可有可无，有的标记是没有属性的。如：<html><head><title>等
l 双边标记的内容在开始和结束标签之间，单边标记没有内容。
l HTML标记可以相互嵌套，但一定注意是顺序嵌套，外层套内层，一层套一层
n <body>的常用属性
l bgcolor：网页背景色。如：<body bgcolor=”red”>
l background:网页背景图片地址。如：<body background=”images/1.jpg”>
n HTML文本修饰标记
l <b></b>：加粗bold。如：<b>HTML文件</b>
l <i></i>：斜体italic。如：<i>HTML文本</i>
l <u></u>：下划线underline。如：<u>HTML文本</u>
l <s></s>：删除线strike。如：<s>HTML文本</s>
l <sup></sup>上标。
l <sub></sub>下标。
l <font></font>字体标记
- Size：文本大小，取值1-7。1小，7大
- Color：颜色值。
- Face：字体。楷体、黑体、宋体、微软雅黑
n HTML排版标记
l <p></p>表示一个段落
- 常用属性：align：水平对齐方式，取值：left（左）、center（居中）、right（右）
- 例：<p align=“right”>段落段落段落段落段落段落段落段落</p>
l 换行标记（单边标记）<br />
l 水平线标记（单边标记）<hr />
- Size：水平线的粗细，单位一般为px。
- Color：水平线的颜色。
- Width：水平线的宽度。可以用百分数 %
- Noshade：去掉水平线的阴影（值等于本身）。如：noshade=”noshade”
l <pre>预排版标记
- 功能：将保留所有的空白字符（空格、换行符），换句话说就是原封不动输出。
l 标题标记：<h1></h1>………<h6></h6>
- 功能：定义各种标题
- 属性：align水平对齐，取值：left、center、right。
- 语法：<h1 align=”left | center | right”></h1>
n <div>和<span>标记
<div>是没有任何意义的标记，但是又是使用最多的标记。<div>一般要与CSS配合使用，<div>是一个块元素。
<span>是没有任何意义的标记，但是又是使用最多的标记。<span>一般要与CSS配合使用，<span>是一个行内元素。
（1）块元素
- 块元素一般是单独占一行，
- 块元素有哪些？<div>、<p>、<h1>、<h2>、<pre>等
（2）行内元素
- 行内元素不会单独占一行。
- 行内元素的宽度，主要是根据内容决定。
- 多个行内元素，会排在一行。
- 行内元素有哪些？<font>、<b>、<i>、<u>、<sub>、<sup>等
结论：在标记嵌套时，一般是块元素中嵌套行内元素。
n HTML字符实体
- 空格： 代表一个半角空格。一个汉字是2个字节：1个字节相当于1个半角空格。
- <：<
- >：>
- &：&
- ￥：¥
- ×：×
- ÷：÷
n HTML项目符号
<ul>
<li>内容1</li>
<li>内容2</li>
<li>内容3</li>
</ul>
- <ul>或<li>的常用属性
- Type：项目符号的类型，取值：disc（小黑点）、circle（空心圆）、square（实心方块）。
注意：在HTML标记中，内容应该放在最底层标记中。
<ul>和<li>是块元素。
n HTML编号列表（有序列表）
<ol>
<li>…………</li>
<li>…………</li>
<li>…………</li>
</ol>
- <ol>或<li>的常用属性
Type：编号类型，取值：1、a、A、i、I
Start：从第几个开始编号（数字）。
n 滚动字幕标记<marquee>（已淘汰）
语法格式：<marquee>滚动的内容</marquee>
常用属性
- Width：滚动宽度
- Height：滚动高度
- Bgcolor：滚动背景色
- scrollAmount：滚动步长值。值越大，滚动越快。
- scrollDelay：两步之间的停留时间，以毫秒单位。1秒=1000毫秒。
- Loop：循环滚动的次数。
- Behavior：滚动的方式。取值：alternate（循环滚动）、scroll（单方向循环滚动）、slide（只滚动一次）
注意：当取值为scroll时，可改变方向（和direction配合使用。Direction：滚动方向，取值：up、down、left、right）
PS：1点了，所有内容都是从自己文档笔记直接复制上来的，有些项目符号显示不出来，还有着重颜色也没有了，将就看吧，觉得有意思的可以联系我发源文档和一些代码例子。
复习上学期的HTML+CSS（1）的更多相关文章
- phd文献阅读日志-博一上学期
为了记住并提醒自己阅读文献,进行了记录(这些论文都是我看过理解的),论文一直在更新中. 博一上学期: 1.week 6,2017.10.16 2014-Automatic Semantic Model ...
- 此文记录了我从研二下学期到研三上学期的找工历程，包括百度、腾讯、网易、移动、电信、华为、中兴、IBM八家企业的面试总结和心得--转
感谢电子通讯工程的研究生学长为大家整理了这么全面的求职总结,希望进入通信公司和互联网公司做非技术类岗位的学弟学妹们千万不要错过哦~ ---------------------------原文分割线-- ...
- 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结
史上最全的CSS hack方式一览 2013年09月28日 15:57:08 阅读数:175473 做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我 ...
- 大二 Java上学期总结
一学期的Java学习结束了,这学期对程序语言的理解更深了,首先感谢李津老师的教导,这学期收获挺多的,不像上学期,这学期没有任何缺课表现,希望之后的语言程序学习会更加努力. 突然感觉Java的学习如此之 ...
- 【软件工程1916|W（福州大学）_助教博客】2019年上学期期末问卷调查结果公示
1.调查问卷概况 福州大学2019W班,收集到有效答卷44份 2. 调查问卷情况 Q1:请问你平均每周在课程上花费多少小时? 去除自估水平超过40小时的,平均16.6H Q2.软工实践的各次作业分别花 ...
- 这可能是史上最全的CSS自适应布局总结教程
标题严格遵守了新广告法,你再不爽,我也没犯法呀!话不多说,直入正题. 所谓布局,其实包含两个含义:尺寸与定位.也就是说,所有与尺寸和定位相关的属性,都可以用来布局. 大体上,布局中会用到的有:尺寸相关 ...
- 记lrd的高二上学期第五次调研考试
河北某某中学的调研考试其实是很好玩的经历呢.可惜没有太多机会了. 背景: NOIP2016回来之后没有好好学文化课-.自习能翘就翘了,衡中特产学案自助没有好好写(说来我好像从来没被老师查到过,上课写学 ...
- 史上最全的CSS hack方式一览
做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道 ...
- [转]史上最全的CSS hack方式一览
做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道 ...
随机推荐
- 如何写出如散文般的代码――《代码整洁之道》读书笔记（Ch1-Ch3）
不知道有多少人像我一样,程序出现问题时添加函数添加变量解决,变量名用a,b,c等"简单"的字母来表示.不知道有多少人像我一样,看完自己的代码,心里暗骂"什么玩意儿!&qu ...
- 2017/11/25 2D变换
2D变换 一.盒模型解析模式 1.box-sizing:盒模型解析模式 1)content-box:标准盒模型(和css2一样的计算) 宽度和高度之外绘制元素的内边距和边框 width,height外 ...
- 第一周CoreIDRAW课总结
一. 问:这节课学到了什么知识? 答:这节课我学到了很多知识,作为初学者的我,老师给我讲了CorelDEAW的启动,安装,基础知识和应用与用途. 基础知识 位图:是由无数个像素点构成的图像,又叫点 ...
- 前端的UI设计与交互之设计原则篇
1.亲密性 a)纵向间距示例这三种规格分别为:8px(小号间距).16px(中号间距).24px(大号间距). b)在这三种规格不适用的情况下,可以通过加减『基础间距』的倍数,或者增加元素来拉开信息层 ...
- 58 同城 iOS 客户端 iOS11 及 iPhone X 适配实践
一.前言 前段时间 WWDC 大会上苹果推出了 iOS11 系统 和 iPhone X 新机型,相信各个 iOS 团队的开发者都已经在计划新系统和新机型的适配工作了.不得不说,新系统和新机型的发布确实 ...
- 如何在win10查看wifi密码
tep1 找到wifi图标 step 2 右键点击打开网络共享中心 没有啦!!
- Python中的classmethod与staticmethod
首先,这是一个经典的问题. 我们首先做一个比较: classmethod的第一个参数是cls,即调用的时候要把类传入 这意味着我们我们可以在classmethod里使用类的属性,而不是类的实例的属性( ...
- 关于hbase中的hbase-site.xml 配置详解
该文档是用Hbase默认配置文件生成的,文件源是 hbase-default.xml hbase.rootdir 这个目录是region server的共享目录,用来持久化HBase.URL需要是'完 ...
- SpringMVC之处理流程
之前在学servlet时写过JavaWeb与Asp.net工作原理比较分析,那篇主要是大致描述了下servlet的工作流程,今天在家了解了下springmvc的工作原理,与asp.net中的mvc进行 ...
- JavaScript(第十一天)【变量，作用域，内存】
JavaScript的变量与其他语言的变量有很大区别.JavaScript变量是松散型的(不强制类型)本质,决定了它只是在特定时间用于保存特定值的一个名字而已.由于不存在定义某个变量必须要保存何种数据 ...