web前段基础知识整理

一.段落标签
1.
align对齐属性值：
值描述
left 左对齐内容
right 右对齐内容
center 居中对齐内容
justify 对行进行伸展，这样每行都可以有相等长度
 标签可定义预格式化的文本。
 被包围在  标签 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。
 提示:  标签的一个常见应用就是用来表示计算机的源代码。
 3.文字斜体   、  
 加粗   、关键词 
 下标  
 上标  
 下划线 
 删除线 
 4.html常用特殊符号
 属性 显示结果 描述
 <；
 >；
 ®；
 ©；
 &trade；
  ； 
 
 
  
   
     
    
   
  
    image.png 
   
  
 
 
 二.列表标签
 1.无序列表：
 

 列表项

  列表项

 

 type属性值：
 值 描述
 disc 圆点
 square 正方形
 circle 空心圆
 2.有序列表
 
  列表项 

  列表项 

 

 type属性值
 值 描述
 1 数字1 2....
 a 小写字母a b...
 A 大写字母A B...
 i 小写罗马数字i
 Ⅰ 大写罗马数字Ⅰ
 3.定义列表
 

 定义列表项

 列表项描述

 定义标签内可以有多个,对于每一个
可以有多个

 
要组合使用
 三1.标签是没有语义的，它的作用就是为了设置单独的样式用的。
 语法： 
 文本
  
  2. 
  
   
     
    
   
  
    image.png 
   
  
 
 3.语法： 
 引用文本
 语法: 
 
引用文本

 4.标签，为网页加入地址信息
 语法： 
 
联系地址信息
 
 如： 
 
文档编写：lilian 北京市西城区德外大街10号
 
 

 本文的作者：lilian
 

 5.标签，添加一行代码
 语法： 
 代码语言 
 注：如果是多行代码，可以使用
标签。
 6.在网页制作过程过中，可以把一些独立的逻辑部分划分出来，放在一个标签中，这个标签的作用就相当于一个容器。 
 语法： 
 
…
 
 语法： 
 
…

 7.创建表格的四个元素： 
 table、tbody、tr、th、td 
 1、
…
：整个表格以标记开始、
标记结束。 
 2、…：如果不加 , table表格加载完后才显示。加上这些表格结构， tbody包含行的内容下载完优先显示，不必等待表格结束后在显示，同时如果表格很长，用tbody分段，可以一部分一部分地显示。（通俗理解table 可以按结构一块块的显示，不在等整个表格加载完后显示。） 
 3、…：表格的一行，所以有几对tr 表格就有几行。 
 4、…：表格的一个单元格，一行中包含几对...，说明一行中就有几列。 
 5、…：表格的头部的一个单元格，表格表头。 
 6、表格中列的个数，取决于一行中数据单元格的个数。
 总结： 
 1、table表格在没有添加css样式之前，在浏览器中显示是没有表格线的 
 2、表头，也就是th标签中的文本默认为粗体并且居中显示
 8.## 用mailto在网页中链接Email地址 
 标签还有一个作用是可以链接Email地址，使用mailto能让访问者便捷向网站管理者发送电子邮件。我们还可以利用mailto做许多其它事情。下面一一进行讲解，请看详细图示：
 
  
  
   
     
    
   
  
    image 
   
  
  
 注意：如果mailto后面同时有多个参数的话，第一个参数必须以“?”开头，后面的参数每一个都以“&”分隔。 
 下面是一个完整的实例: 
  
  
   
     
    
   
  
    image 
   
  
 
 9.当用户需要在表单中输入大段文字时，需要用到文本输入域。 
  
 语法： 
 文本
 1、标签是成对出现的，以<textarea>开始，以结束。 
 2、cols ：多行输入域的列数。 
 3、rows ：多行输入域的行数。 
 4、在标签之间可以输入默认值。 
 举例： 
 

 联系我们
 在这里输入内容...
 

 10.使用单选框、复选框，让用户选择
 语法： 
 
 1、type: 
 当 type="radio" 时，控件为单选框 
 当 type="checkbox" 时，控件为复选框 
 2、value：提交数据到服务器的值（后台程序PHP使用） 
 3、name：为控件命名，以备后台程序 ASP、PHP 使用 
 4、checked：当设置 checked="checked" 时，该选项被默认选中
 11.使用下拉列表框，节省空间
 
 1、value： 
  
  
   
     
    
   
  
    image 
   
  
  
 2、selected="selected"： 
 设置selected="selected"属性，则该选项就被默认选中。 
 使用下拉列表框进行多选 
 下拉列表也可以进行多选操作，在
 type：只有当type值设置为submit时，按钮才有提交作用 
 value：按钮上显示的文字
 13.使用重置按钮，重置表单信息
 语法： 
  
 type：只有当type值设置为reset时，按钮才有重置作用 
 value：按钮上显示的文字 
 四、认识CSS样式 
 1.
 14.三种方法的优先级
 总结来说，就是--就近原则（离被设置元素越近优先级别越高）。
 15.伪类选择符
 更有趣的是伪类选择符，为什么叫做伪类选择符，它允许给html不存在的标签（标签的某种状态）设置样式，比如说我们给html中一个标签元素的鼠标滑过的状态来设置字体颜色： 
 a:hover{color:red;}
 上面一行代码就是为 a 标签鼠标滑过的状态设置字体颜色变红。这样就会使第一段文字内容中的“胆小如鼠”文字加入鼠标滑过字体颜色变为红色特效。
web前段基础知识整理

使用下拉列表框进行多选

四、认识CSS样式

你可能感兴趣的:(web前段基础知识整理)
