html网页设计细节总结及实践经验总结

Posted 2020-09-18

 

1)        <link  rel=” ”  type=”text/css”  href=”__.css”>是空元素，仅包含属性。用来定义文档与外部资源的关系，常用于链接样式表。其中type指被链接文档的类型，href指被连接的文档。

2)        块级元素和行级元素的区别：

块级元素会自动换行，总是在新行上开始，一个块级元素占据一整行。想要在同一行显示需浮动（floa：left）或（display：inline）。

行级元素多个元素金额与并排显示，默认设置宽度是不起作用，需设置display：inline-block或者block换行才能多行显示。

3)        常用的块级元素：

标题标签<h>、段落标签<p>及水平线标签<hr/>

 

 

  有序标签<ol>、无序表签<ul>、表格<table>、表单<form>及分区<div>

4)        常用的行级标签：

文字<input>、图片<img/>、超链接<a>

 

 

  其他相关如<spn>、<br/>

5)        绝对路径（完整路径）：

  访问一个域名的网址 如：http：//www.163.com/123.html

 

 

  访问本地计算机上的文件路径 如：D:/html/123.html

6)        相对路径: 指从一个文件到另一个文件所经过的路径。

注意：../表示相对与当前目录的上级目录 …/表示相对于当前目录的上上级目录

7)        在html中，“type”属性值表示显示内容的类型。

8)        常用词的含义：

  Src：用来显示打开图片的地址信息

  Href：用于打开超链接的跳转地址信息

     Target：用于指定目标文件在网页中的打开位置即在何处打开 如：在新窗口、当前等。

  

9)        Html只负责网页的内容结构，css（层叠样式表）负责表现形式（字体大小、颜色、背景图、显示位置等）方便网站的修改和维护

10)    &nbsp；表示空格注意有分号，&quot表示双引号

11)    表格常用属性：

  Cellspacing：设置单元格之间的空白 即设置其为0时边框是实心的

  Cellpadding：设置单元边沿与其内容之间的空白2017-05-17

  Colspan：跨列

  Rowspan:跨行

12)    表单常用属性：

13)      Value：指定表单元素的初始值，供显示的文本。即打开网页时第一次看到 

14)            的信息。

15)      Checked：表示此属性是否选中。

16)      Select：用来定义一个选择列表

17)      Submit：表示提交按钮

18)      reset：表示重置按钮

19)      Button：普通按钮

20)     document.write(" "); 在javascript表示“输出函数”，要输出的内容。

 只能在 HTML 输出中使用 document.write，并且要放在<script> </script>中。

21)     <button type="button" onclick="alert(‘Welcome!‘)">点击这里</button>

 alert() 函数在 JavaScript 中表示消息弹出对话框，用于提醒用户。

Onclick表示触发该事件，便于做后续动作。

22)    JavaScript：改变 HTML 内容

 <script>

function myFunction()

{

x=document.getElementById("demo");  // 找到元素

x.innerHTML="Hello JavaScript!";    // 改变内容

}

</script>

23)     在javascript中，要保证输入的数值为“整数”才能进行运算，必须在提示对话框prompt前加parseInt，即number=parseInt(prompt())，比如在进制的转换。要保证输入的数值能进行其他运算，必须在提示对话框prompt前加parseFloat，即number=parseFloat(prompt())。比如四则运算。

24)     在中，document.write()方法的功能用于在网页上输出内容。

25)    Javascript中sort()函数用于排序，要实现数字的正确排序，必须定义该函数，实现字符串的排序不需要定义，直接可以调用。如果字符串是数字，则整体的排序是先数字后单词。还要注意的是在字符串的排序中，单词是按首字母先大写后小写。整个排序呈现“上升”。先定义函数如下：

 

26)    a.push(value )在数组的末尾加上value值。

a.unshift(value )在数组的最前面加上value值。

a.pop( ) 删除数组的最后一个值。

a.shift( ) 删除数组的第一个一个值。

a.reverse( ) 将原来的数组值按照对称改换。如下图所示:

 

27)     a.concat(value)  把value的值连接到原来数组的后面。

28)     a.join( value) 将数组中每两个字符串中间用value隔开。比如用点取代逗号。

29)     a.slice(1,3)   在数组中选取元素，如从第一个位置开始（包括第一个）到第三个位置结束（不包括第三个）。

30)     a.splice(2,3,”dfsad”) 在数组中删除元素并且加入元素。 如从第二个元素开始（不包括第二个元素），总共删除三个元素，再其删除的后面加上元素dfsad,最后写出后面没有删除的元素

31)     

32)     

33)     

34)     

35)     

36)     

37)     

38)     

39)     

40)     

 

 

个人心得体会：

1. 在做html的外观样式时，常借助F12键来查看基本信息，便于直接写出相关信息。将外部样式与行内样式相结合，达到意想不到的效果