随笔分类 - web前端基础
日常学习笔记
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <!-- 网页中将字体分为五大类 serif(衬线字体) • sans-serif(非衬线字体) • monospace (等宽字体
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .p1{ /* 设置字体颜色 color设置颜色 font-size设置的并不是文字本身大小 页面中,每个文字都是
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> /* 使用十六进制的rgb值表示颜色 使用三组两位的十六进制数组表示一个颜色 语法:#红色绿色蓝色 十六进制 0
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .box1{ width: 100px; height: 100px; /* 颜色单位 直接使用颜色单词表示不同颜
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> /* 长度单位 像素 px - 像素是我们在网页中使用最多的一个单位 一个像素相当于屏幕中一个点 屏幕实际上由像素
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> /* 去掉项目符号 */ /* ul{ list-style: none; } */ </style> </hea
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <!-- <em> 表示一段内容中着重点(显示为斜体) <strong> 表示一个内容的重要性(显示粗体) 可以单独使用也可一起使用
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> /* 设计a的伪类4种 :link } :visited } 不能写在hover active下 :hover 不
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>选择器优先级</title> <style type="text/css"> .p1{ background-color: yellow; } p{ background-colo
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>样式继承</title> </head> <body> <!-- 祖先元素上的样式 也会被后代元素继承 利用继承,可以将一些基本样式设置给祖先元素,所有后代元素都会继承这些样式 不
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>否定伪类</title> <style type="text/css"> /* 为所有p元素设置背景为黄色,除了class为he 否定伪类 作用: 可以从已选中的元素中剔除某些元素
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>兄弟元素选择器</title> <style type="text/css"> /* 为span后的一个p元素设置背景为黄色 后一个兄弟元素选择器 - 可以选中一个元素后紧挨着的指
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>子元素伪类</title> <style type="text/css"> /*为第一个p标签设置背景黄*/ /*:first-child 可以选中第一个子元素*/ /*:last
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>属性选择器</title> <style type="text/css"> /* 为所有具有title属性p元素设置背景颜色黄色 属性选择器 - 根据元素中的属性或属性值选取指定元
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>伪元素</title> <style type="text/css"> /* 使用伪元素来表示元素中的一些特殊的位置 */ /* 为p中第一个字符设置特殊样式 */ p:first
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>伪类选择器</title> <style type="text/css"> /* 伪类专用来表示元素的一种特殊状态 需要为处在特殊状态的元素设置样式 伪类四个样式 -link 正常
阅读全文
摘要:常用选择器 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>选择器</title> <style type="text/css"> /* 设置颜色为红 元素选择器 p{ color: #FF0000; } id选择器 语法 #i
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <!-- 块元素(独占一行):做页面布局 div p h1~h6 内联元素(行元素):设置样式 span(专门用来选中文字,为文字设
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>CSS</title> <!-- <style type="text/css"> p{ color: red; font-size: 30px; } </style> --> <l
阅读全文
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>练习</title> </head> <body> <!-- center标签中的内容会默认在页面居中 --> <center> <a href="#nn" >底部</a> <!-
阅读全文

浙公网安备 33010602011771号