1115 HTML CSS

1. HTML 全称HyperText Markup Language (超文本标记语言)。

2. 网页=HTML文件 + Web服务器 + CSS文本。

3. Web服务器:处理浏览器请求,寻找资源发送至浏览器。

4. 浏览器通过统一的HTML了解网页的结构和内容,并显示出来。

5. 当浏览器阅读HTML时,它会解析包围文本的标签;<html>标签通知浏览器这是一个HTML文件,HTML文件不内嵌特殊格式,文件的内容至关重要;Web建立在没有任何特殊格式字符的文本文本文件上,这使得它可以在全世界各个地方都能接收网页并理解内容;

6. 作为一个初学者,请使用文本编辑器编写html文件,这对你了解网页的构建更有帮助,等你成为一个高手,需要提升效率时,可以使用Dreamweaver、FrontPage、Golive等功能强大的网页设计软件;

7. 元素可以拥有属性,属性提供元素的更多信息,使用CSS样式时必须指定“text/css”作为样式属性;CSS和HTML一起使用十分强大;#d2b48c是16进制颜色,以后详细学习;“body”意味着“{”和“}”之间所有CSS文本用于HTML<body>标签元素中的内容;

8. CSS是级联样式表(Cascading Style Sheet), 用以控制HTML的外观;

9. HTML标记内容,用标签提供结构,匹配标记和他们之间的内容称之为元素,一个元素由开始、内容、结束构成;

10. 用户无法自定义一个html属性,因为浏览器只知道事先指定好的每个元素的属性;委员会决定HTML的元素和属性是否被支持;

11. 参考:HEAD FIRST HTML && CSS 和 《HTML和XHTML权威指南》;

12. 属性用来个性化元素,比如href就是连接指向;

13. 组织网站没有绝对正确的形式,但是要方便将来的扩建和管理,有时我们需要在几个网页中重复使用某些图像,所以将图像全部放在项目的根目录的一个文件夹中,但是如果你的网站需要在不同的网页文件中使用大量的图像,就可以在每个枝叶目录下设置各自的图像文件夹;

14. 使用“..”表示向上追溯到父目录,这个很像CMD和linux的命令;这个可以叠加使用;上溯的最大限是网站根目录;路径字数限制是255个;必须使用“/”分隔符,而不是Windows的“\”;

15. 某些浏览器,包括IE6,对<q>标签包括的文字不显示双引号;

16. 引用多文字使用<blockquote>,文字中夹杂一点引用用<q>,前者像是一个新的段落,是块(block)元素,后者是内联(inline)元素,块元素前后都有换行符,内敛元素在网页中随着文字流出现在“行内”;

17. 块元素特立独行,内敛元素随波逐流;

18. 没有HTML内容的元素称为空元素;

19. 列表元素<li></li>,<ol></ol>封装有序列表元素,<ul></ul>封装无序列表元素,列表元素和封装必须一起使用,列表是一组项目,元素确定每一个项目,封装是他们的组合,封装没有别的属性,可以在列表中嵌套列表;

20. 列表还有一种类型:自定义列表。<dl></dl>是封装,<dt></dt>是项限,<dd></dd>是描述;套娃
21. > 符号的缩写是&gt,<是&lt,&amp;代替&本身,版权标记及所有标记可以在http://www.w3school.com/tays/ref-entities.a2p,也可以在更详细的清单网站查看:http://www.unicode.org/charts/;使用实体显示特殊字符;

22. 品尝一些元素:<a>链接, <em>斜体 强调, <address>地址,<strong>着重强调,<pre>显示输入文本前格式化文本,<q>引用,<blockquote>长文字引用,<p>段落,<ul>无序列表的封装 比如计划表,<ol>有序列表,<br>换行空元素,<hr>制作水平线,<code>显示程序代码,<li>列表元素;

23. HTML的一半乐趣在于实践!

24. 在输入内容之前先计划好网页的结构,画草图,再画略图,最后写HTMl;

用大的块元素来创建网页,用内联元素修饰,通常使用最最匹配内容含义的元素,需要列表时绝对不使用段落表示;

25. <p>、<blockquote>、<ol>、<ul>和<li>都是块元素,可以独立显示,文本前后有空行,<q>、<rm>、<a>是内联元素,这些元素的内容和其他内容一起跟随在文字流中,当你需要换行时使用<br/>(封闭自身,既是开始又是结束标签的空元素),空元素不含有内容,一个空元素仅由一个标记组成;

26. 可以使用start属性指定列表顺序,value改变每项的值;这个不会!

时间: 2024-11-06 21:35:36

1115 HTML CSS的相关文章

CSS实现的几款不错的菜单栏

前言 自从做了智慧城市这个项目之后,我一个做后端的开发者,瞬间转为前端开发,不过我还是很喜欢前端的.前端那些事,其实蛮有意思的,HTML实现的是静态的,使用ajax之后就可以和数据库交互了,加上js和jQuery之后就动起来了,加上CSS之后就更加炫酷了.因为项目中需要,查资料和编写了一些炫酷的二级菜单,分享给大家,好东西就要分享嘛! 一.滑动菜单 1.代码: 1 <!DOCTYPE HTML> 2 <html lang="en-US"> 3 <head&

css中的px、em、rem 详解

概念介绍: 1.px (pixel,像素):是一个虚拟长度单位,是计算机系统的数字化图像长度单位,如果px要换算成物理长度,需要指定精度DPI(Dots Per Inch,每英寸像素数),在扫描打印时一般都有DPI可选.Windows系统默认是96dpi,Apple系统默认是72dpi. 2.em(相对长度单位,相对于当前对象内文本的字体尺寸):是一个相对长度单位,最初是指字母M的宽度,故名em.现指的是字符宽度的倍数,用法类似百分比,如:0.8em, 1.2em,2em等.通常1em=16px

CSS样式的优先级

1.相同权值情况下,CSS样式的优先级总结来说,就是--就近原则(离被设置元素越近优先级别越高): 内联样式表(标签内部)> 嵌入样式表(当前文件中)> 外部样式表(外部文件中). 2.权值不同时,浏览器是根据权值来判断使用哪种css样式的,哪种样式权值高就使用哪种样式. 下面是权值的规则: 标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100.例如下面的代码: p{color:red;} /*标签,权值为1*/ p span{color:green;} /*两个标签,权值为1+

CSS 之怀疑自己的审美 2 (Day50)

阅读目录 伪类 选择器的优先级 css 属性操作 一.伪类 anchor伪类:专用于控制链接的显示效果 ''' a:link(没有接触过的链接),用于定义了链接的常规状态. a:hover(鼠标放在链接上的状态),用于产生视觉效果. a:visited(访问过的链接),用于阅读文章,能清楚的判断已经访问过的链接. a:active(在链接上按下鼠标时的状态),用于表现鼠标按下时的链接状态. 伪类选择器 : 伪类指的是标签的不同状态: a ==> 点过状态 没有点过的状态 鼠标悬浮状态 激活状态

CSS颜色代码大全

CSS颜色代码大全 颜色代码表(一): EEEEEE FFCCFF FF66FF FF00FF DDDDDD FFCCCC FF66CC FF00CC CCCCCC FFCC99 FF6699 FF0099 BBBBBB FFCC66 FF6666 FF0066 AAAAAA FFCC33 FF6633 FF0033 999999 FFCC00 FF6600 FF0000 888888 CCCCFF CC66FF CC00FF 777777 CCCCCC CC66CC CC00CC 666666

如何使用Flexbox和CSS Grid,实现高效布局

CSS 浮动属性一直是网站上排列元素的主要方法之一,但是当实现复杂布局时,这种方法不总是那么理想.幸运的是,在现代网页设计时代,使用 Flexbox 和 CSS Grid 来对齐元素,变得相对容易起来. 使用 Flexbox 可以使元素对齐变得容易,因此 Flexbox 已经被广泛使用了. 同时,CSS Grid 布局也为网页设计行业带来了很大的便利.虽然 CSS Grid 布局未被广泛采用,但是浏览器逐渐开始增加对 CSS Grid 布局的支持. 虽然 Flexbox 和 CSS Grid 可

css基础

css绝对是一个能够写到爆炸的东西,so,机智的小北方才不会写各种css样式具体的效果,相比之下更推荐大家记一些常用的key,至于效果,每次用的时候百度下就可以了, css的作用是对符合条件的标签进行渲染,那么首先就要匹配到对应标签啦,我萌有三种基础的模式来匹配希望改变样式的标签 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8">

前端 css 垂直居中及自适应问题

此css作用为将下面div结构中的Container-fluid背景自适应屏幕,content自适应居中 1.Div结构 all Head Container-fluid Content Under <div id="all">   <div  class="head" style="height: 81px;width: 100%;min-width: 1000px;position: relative;">      

css遮罩层

父元素:position:fixed; 让子元素居中对齐:position:absolute;top:0;bottom:0;left:0;right:0;margin:auto; <style> .loading{width:100%;height:100%;position:fixed;top:0;left:0;z-index:100;background:#fff;} .loading .pic {width:50px;height:50px;background:url(images/l