1.+选择器div+p:选择紧接在div后的所有p元素;

2.导航的样式:(注意:不给a设置width:100%;只是需要display:block;利用流布居;)

<h4>无宽度,借助流动性</h4>
<div class="nav">
<a href="" class="nav-a">导航1</a>
<a href="" class="nav-a">导航2</a>
<a href="" class="nav-a">导航3</a>
</div>
.nav {
background-color: #cd0000;
}
.nav-a {
display: block;
margin: 0 10px;
padding: 9px 10px;
border-bottom: 1px solid #b70000;
border-top: 1px solid #de3636;
color: #fff;
}
.nav-a:first-child { border-top:; }
.nav-a + .nav-a + .nav-a { border-bottom:;}

原则:无宽度,无浮动,无图片;

css世界的学习笔记的更多相关文章

  1. 《CSS世界》学习笔记(一)

    <CSS世界>,张鑫旭著,人民邮电出版社,2017年12月第一版. 1.P9二维码链接文章的demo值得一看,可以实现有关“某些区域颜色始终保持一致”的效果. P9二维码所链接文章的一个d ...

  2. 从今天开始 每天记录HTML,CSS 部分的学习笔记

    从今天开始 每天记录HTML,CSS 部分的学习笔记

  3. CSS Grid 布局学习笔记

    CSS Grid 布局学习笔记 好久没有写博客了, MDN 上关于 Grid 布局的知识比较零散, 正好根据我这几个月的实践对 CSS Grid 布局做一个总结, 以备查阅. 1. 基础用法 Grid ...

  4. CSS权威指南学习笔记系列(1)CSS和文档

    题外话:HTML是一种结构化语言,而CSS是它的补充:这是一种样式语言.CSS是前端三板斧之一,因此学习CSS很重要.而我还是菜鸟,所以需要加强学习CSS.这个是我学习CSS权威指南的笔记,如有不对, ...

  5. css权威指南学习笔记 —— css选择器

    1,选择器:选择器的一些基本常用规则基本都记得,w3c上都有,平时也常用,不常用的一些后代选择器经常就忘记了.一些归纳一下后代选择器,加深一下印象: a:子选择器:   p>a  a是直接是p的 ...

  6. 原生 CSS 网格布局学习笔记

    下是来自Oliver Williams的帖子. Oliver已经学习了相当长时间的原生CSS网格,可以说是在CSS网格方面有一定的发言权.在这篇文章中,他将以非同寻常的思路分析自己的CSS网格布局学习 ...

  7. 《CSS世界》读书笔记(十六)

    <!-- <CSS世界>张鑫旭著 --> line-height与“垂直居中” line-height 可以让单行或多行元素近似垂直居中,原因在于 CSS 中“行距的上下等分机 ...

  8. 《CSS世界》读书笔记(十五)

    <!-- <CSS世界>张鑫旭著 --> 字母x——CSS世界中隐匿的举足轻重的角色 在各种内联相关模型中,凡是涉及垂直方向的排版或者对齐的,都离不开最基本的基线(baseli ...

  9. 《CSS世界》读书笔记(十四)

    <!--  <CSS世界>张鑫旭著 --> 功勋卓越的 border 属性 border-width 不支持百分比值 border-style 类型 border-style ...

随机推荐

  1. Xamarin Essentials教程构建共享请求

    Xamarin Essentials教程构建共享请求 共享请求类ShareTextRequest可以用于构建复杂形式的数据,用于向其他应用传输.例如,它可以指定共享内容的主题Subject,用于给邮件 ...

  2. jmeter connection reset解决方法

    方法仅作参考: 1.修改HTTP请求下面的Impementation选项,改成HttpClient4 2.在user.properties文件内修改: hc.parameters.file=hc.pa ...

  3. python3.4爬取网页的乱码问题

    python学习资料文档知识点链接:http://bbs.fishc.com/forum.php?mod=forumdisplay&fid=243&filter=typeid& ...

  4. 网络测试工具 - QCheck

    本片博客内容借鉴51CTO中joyssue博主文章. 网络性能不仅与交换和路由设备的性能相关,而且与线路质量也有很大关系.使用Qcheck可以测试网络性能.这是NetIQ公司开发的一款免费网络测试软件 ...

  5. 获取html下的所有纯文本的方法

    第一种是看别人博客的,第二种是自己发现的. 第一种: #-*- coding: utf8 -*- import re html = """ <div class=& ...

  6. 小甲鱼Python第三讲课后习题

    0.以下哪个变量的命名不正确?为什么? A:MM_520 B:_MM520_ C:520_MM D:_520MM 变量 命名:以字母.下划线.数字组成,以字母.下划线开头 1.除了使用反斜杠(\)进行 ...

  7. Linux之磁盘分区篇

    作业三: 1)   开启Linux系统前添加一块大小为20G的SCSI硬盘 2)   开启系统,右击桌面,打开终端 3)   为新加的硬盘分区,一个主分区大小为10G,剩余空间给扩展分区,在扩展分区上 ...

  8. 转 What is Redis and what do I use it for?

    原文: http://stackoverflow.com/questions/7888880/what-is-redis-and-what-do-i-use-it-for Redis = Remote ...

  9. leetcode笔记--水箱问题

    类型的引用:Solution *s=new Solution(); 1.Container With Most Water Given n non-negative integers a1, a2, ...

  10. SharePoint 上传文档提示别人迁出

    前言 我们在使用SharePoint文档库的时候,经常会遇到文档被别人迁出,自己无法修改的情况.这时候,我们最好的办法就是找到那个迁出的人,怼他!如果,他已经离职了,我们无法找到,那么,就请继续往瞎看 ...