HTML+CSS基础笔记

来源：互联网发布：闪电拦截管家软件编辑：程序博客网时间：2024/06/05 15:14

1、语义化：语义化是指用合理HTML标记以及其特有的属性去格式化文档内容。

2、em和strong的区别：都表示强调，一个为斜体，一个为粗体，国内前端更常用strong。

3、q标签实际效果为双引号，但更重要的是其语义为引用，语义化可以更好的被搜索引擎识别和发现。

4、q标签为短文本引用，blockquote则为长文本引用，会有缩进效果。

5、br标签，xhtml1.0写法：<br />,html4.01写法：<br>

注：现在一般使用 xhtml1.0 的版本的写法（其它标签也是），这种版本比较规范。

6、空标签，没有HTML内容的标签为空标签，如<br />、<hr />和<img />。

7、单行代码用code，多行代码用pre。

8、ul无序列表，ol有序列表，un和order。

9、表格元素，table,tbody,tr,th,td。

10、<table summary="表格简介文本">不会显示出来，但可以让搜索引擎更好的搜索到，caption为表格标题文本。

11、<a href="mailto:XX@qq.com?subject=主题&body=内容">发送邮件</a>

12、form表单中的label标签，鼠标点击后，光标自动转到相关控件上，前提是id属性值一定要相同。

13、注释

14、注释，html中是，css中/*注释内容*/。

15、从CSS 样式代码插入的形式来看基本可以分为以下3种：内联式、嵌入式和外部式三种。

16、内联式 > 嵌入式 > 外部式但是嵌入式>外部式有一个前提：嵌入式css样式的位置一定在外部式的后面，且在相同权值的情况下。

17、子选择器(>)和后代选择器(空格)：子选择器是选择第一代后代，后代选择器选择所有后代。

18、权值的规则：标签的权值为1，类选择符的权值为10，ID选择符的权值最高为100。例如下面的代码：

p{color:red;} /*权值为1*/
p span{color:green;} /*权值为1+1=2*/
.warning{color:white;} /*权值为10*/
p span.warning{color:purple;} /*权值为1+1+10=12*/
#footer .note p{color:yellow;} /*权值为100+10+1=111*/

注意：还有一个权值比较特殊--继承也有权值但很低，有的文献提出它只有0.1，所以可以理解为继承的权值最低。

19、元素分类：块状元素，内联（行内）元素、块状内联元素。块状元素：display:block;新起一行，其后元素也新起一行，独立成块，默认情况下其宽度为父级100%。内联元素：display:inline;元素的宽，高，顶部，底部边距不可设定。内联块状元素：display:inline-block;既和其他元素在一行，又可以设置宽高及边距等。

20、padding又称为“填充”。

21、在网页中，元素有三种布局模型：1、流动模型（Flow）2、浮动模型 (Float)3、层模型（Layer）

22、层模型有三种形式：1、绝对定位(position: absolute)2、相对定位(position: relative)3、固定定位(position: fixed)

23、position:absolute;然后设置left,top等，是相对于父元素的位置来说，left:20px，相当于向右便宜20px；position:relative，是相对于原来的位置来说，left:20px，相当于元素向左移动20px。

24、利用absolute和relative联合布局，前辈元素元素relative，定位元素absolute，这样就可以在定位元素里面用属性操作位置了。

25、margin和pading顺序是top,right,bottom,left，上右下左。

26、水平居中，分为

行内元素的水平居中（设置父元素的text-align:center;）

定宽块状元素的水平居中（定宽度！width:500px + margin:50px auto）。

不定宽块状元素：有三种方法居中（这三种方法目前使用的都比多）：

加入 table 标签
设置 display;inline 方法
设置 position:relative 和 left:50%;

27、垂直居中，分为

父元素高度确定的单行文本

父元素高度确定的多行文本（两种方法）

28、隐形改变display属性：当设置float:left或者position:relative后，如a标签等行内元素就可以设置宽度了。

阅读全文

0 0