随笔分类 -  CSS学习笔记

实践案例-五彩导航条
摘要：1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>五彩导航栏</title> 6 <style> 7 .nav a { 8 width:120px ; 9 height: 58px; 10 display: i 阅读全文
posted @ 2021-07-07 09:23 幼兒园扛把子 阅读(913) 评论(0) 推荐(0)
实践案例-小米官网侧边导航栏简易版
摘要：这是成品图 要实现这样的一个功能 背景色会灰色 鼠标划过去变成橙色 1、我们可以用<a>标签来做 如图所示 把框架先建立起来 1 <a href="#">手机 电话卡</a> 2 <a href="#">电视 盒子</a> 3 <a href="#">笔记本 显示器</a> 4 <a href="# 阅读全文
posted @ 2021-07-06 09:50 幼兒园扛把子 阅读(822) 评论(0) 推荐(0)
元素显示模式总结及元素显示模式的转换
摘要：元素模式 元素排列 设置样式 默认宽度 包含 块级元素 一行只能放一个块级元素 可以设置宽度高度 容器的100% 容器级可以包含任何标签 行内元素 一行可以放多个行内元素 不可以直接设置宽度高度 它本身内容的宽度 容纳文本或者其他行内元素 行内块元素 一行放多个行内块元素 可以设置宽度和高度 它本身 阅读全文
posted @ 2021-07-05 15:58 幼兒园扛把子 阅读(79) 评论(0) 推荐(0)
CSS的元素显示模式
摘要：常见的块元素 <h1>~<h6> 、<p>、<div>（最典型的块元素）、<ul>、<ol>、<li> 特点： 1、比较霸道。独占一行 2、高度宽度外边距以及内编辑都可以控制 3、宽度默认是容器（父级宽度）的100% 4、是一个容器及盒子，里面可以放行内或者块级元素 行内元素（内联元素） <a>、< 阅读全文
posted @ 2021-07-05 15:54 幼兒园扛把子 阅读(41) 评论(0) 推荐(0)
复合选择器总结
摘要：选择器 作用 特征 使用情况 隔开符号及用法 后代选择器 用来选择后代元素 可以是子孙后代 较多 符号是空格 .nav a 子代选择器 选择最近一级元素 只选亲儿子 较少 符号是大于 .nav>p 并集选择器 选择某项相同样式的元素 可以用于集体声明 较多 符号是逗号 .nav,.header 链接 阅读全文
posted @ 2021-07-05 15:28 幼兒园扛把子 阅读(63) 评论(0) 推荐(0)
focus伪类选择器
摘要：用于选取获得焦点的表单元素 1 input：focus{ 2 background-color：yellow；//获得光标的表单颜色改为黄色 3 } 把获得光标的input表单元素选取出来 阅读全文
posted @ 2021-07-05 14:53 幼兒园扛把子 阅读(77) 评论(0) 推荐(0)
链接伪类选择器
摘要：a:link //选择所有未被点击访问的链接//a:visited //选择所有已被访问的链接//a:hover //选择鼠标点击滑过去上的链接//a:active //选择活动链接（鼠标点击按下不动的链接）// 注意事项： 1、为了确保生效，要按照LVHA的顺序声明 :link- :vistied 阅读全文
posted @ 2021-07-05 11:43 幼兒园扛把子 阅读(73) 评论(0) 推荐(0)