内容概要

  • CSS
  • CSS注释与语法结构
  • CSS三种引入方式
  • CSS基本选择器
  • 组合选择器
  • 属性选择器
  • 分组与嵌套
  • 伪类选择器
  • 伪元素选择器
  • 选择器优先级
  • css属性相关(操作标签样式)
  • 字体属性
  • 文字属性
  • 背景图片
  • 边框
  • display属性
  • 盒子模型
  • 浮动



less nth选择器 使用css变量_CSS属性

CSS基本，选择器...https://www.zhihu.com/video/1244010866330423296


less nth选择器 使用css变量_CSS属性_02

CSS属性相关https://www.zhihu.com/video/1244011102364794880

每日测验


今日考题


答案：


1.1.列举字符串,列表，元组，字典每个常用的五个方法

  str：切片，下标，+拼接，in，not in，count计数，endswith以什么结尾，startswith以什么开始，
       find检查字符是否在源字符串中，isdigit只包含数字，isalnum数字和字母，upper大写，lower小写，
       title首字母大写，isupper是否大写，len多少位，replace替换，strip，rstrip，lstrip删除空格，
  list：append，del，delete，insert，+，*，切片，下标，嵌套list[1][0],len,max,min,count,pop,
        remove,clear,copy,reverse反转,sort排序，list转化
  tuple：add，type，del删除整个元组，len，+，*，in，not in，切片，max，min，tuple转化
  dict：dict['key']访问value值修改value值，get，len，str，type，pop


2.描述下列常见内置函数的作用可用代码说明map,zip,filter,sorted,reduce


map：会根据提供的函数对指定序列做映射。
    先定义一个pow函数，return x ** 2
    In [5]: list(map(lambda x: pow(x,2),list(range(5))))
    Out[5]: [0, 1, 4, 9, 16]

sorted:与lambda将list的数按照lambda定义的的key值排序
#一个整数列表，要求按照列表中元素的绝对值大小升序排列
In [18]: list1 = [3,5,-4,-1,0,-2,-6]
    ...: sorted(list1, key=lambda x: abs(x))
    ...:
Out[18]: [0, -1, -2, 3, -4, 5, -6]

filter（func，seqs）:寻找满足条件的
# list1 = [3,5,-4,-1,0,-2,-6]
In [25]: list(filter(lambda x:x > 0,list1))
Out[25]: [3, 5]

reduce（function，seqs）依次对容器内所有元素进行操作，比如相加
#其中reduce函数是python中的一个二元内建函数，它可以通过传给reduce中的函数（必须是二元函数）
#**依次**对数据集中的数据进行操作。例如传给reduce的函数是做加法，数据集是list1，那么reduce
#函数的作用就是将数据集中的数据依次相加
# list1 = [3,5,-4,-1,0,-2,-6]
In [30]: reduce(lambda x,y:x+y,list1)
Out[30]: -5

zip：反转打包解包
list1 = [1,2,3,4]
list2 = ["a","b","c","d"]
zipobj1 = zip(list1,list2)
print(dict(zipobj1))    # {1: 'a', 2: 'b', 3: 'c', 4: 'd'}

list3 = [1,2,3,4]
list4 = ["a","b","c","d"]
list5 = ["a2","b2","c2"]
zipobj2 = zip(list3,list4,list5)
print(list(zipobj2))    # [(1, 'a', 'a2'), (2, 'b', 'b2'), (3, 'c', 'c2')]


3.列举你所知道的面相对象中的__开头__结尾的方法及作用，越多越好


__init__,__str__打印对象，__del__,__name__名字，__dict__打印对象的属性k，v形式，
__class__返回一个类的实例，__call__最高级调用,__new__创建新对象


4.写出form标签几个关键性的属性及作用


<form action='' method='' enctype=''></form>

method属性：规定用于发送 form-data 的 HTTP 方法。实际上就是请求的方式。
name属性：表单的名称。
action属性：指定表单请求的路径
target属性：指定action的Url在哪里打开
enctype： 指定数据的编码格式


5.列举你所知道的css选择器


1.基本选择器：通用，标签，id ‘#’，class ‘.’
2.组合选择器：后代'空格' ，子元素‘>’，毗邻 ‘+’，弟弟 ‘~’
3.属性选择器：[username],[username='111'],input[username='111']
4.分组和嵌套选择器:分组‘，’逗号表示并列关系，嵌套‘空格’
5.伪元素选择器：p:first-letter,p:after,p:before
6.伪类选择器：书写顺序：link > visited > hover/active
                       点击前，点击后，悬浮/点击时


内容详细

CSS

层叠样式表:就是给HTML标签添加样式的，让它变的更加的好看


# 注释


CSS选择器

基本选择器


<!DOCTYPE html>


组合选择器


<


属性选择器


<!DOCTYPE html>


分组与嵌套


<!DOCTYPE html>


伪类选择器


<!DOCTYPE html>


伪元素选择器


first


选择器优先级


"""


css属性相关


<


字体属性


当你想要一些颜色的时候


文字属性


text


背景图片


<!DOCTYPE html>


边框


<!DOCTYPE html>


display属性


display


盒子模型


盒子模型


浮动


浮动的元素


小总结：


# 注释
/**/  由于前端代码都笔记多并且没有什么规律 所以我们都会利用注释来帮助我们维护代码

# 语法结构
选择器 {
  属性1:值;
    属性2:值;
  属性3:值;
}

# 选择器
1.基本选择器
    id选择器
    #d1 {}
  类选择器
    .c1 {}
  标签选择器
    div {}
  通用选择器
    * {}
    p#d1.c1  <p id="d1" class="c1"></p>  emmet插件

2.组合选择器
    我们将前端标签的嵌套定义为父亲 儿子 后代 兄弟等等关系
    后代选择器
    div p {}  只要是div内部的p都拿到
  儿子选择器
    div>p {}    只拿内部第一层级的p
  毗邻选择器
    div+p   {}  紧挨着我的同级下一个
  弟弟选择器
    div~p   {}  同级别下面所有的p

3.属性选择器  []
    [username]
  [username='jason']
  input[username='jason']
ps:标签既可以有默认的书写 id class...
  还可以有自定义的书写并且支持多个
  <p id='d1' username='jason'></p>