html设置内边距不改变大小,**css+html为什么右侧菜单的字体大小和边距设置在失效?谁能看下*...

本文主要是介绍html设置内边距不改变大小,**css+html为什么右侧菜单的字体大小和边距设置在失效?谁能看下*...,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

左侧菜单女装对应的右下侧菜单的类.rightNav和.rightNav dl以及.rightNav dd上设置的边距和字体大小不生效,只有字体颜色生效(可改)。右下侧菜单就是那些橙色字体。

具体见下截屏:

bVbqJDu?w=1256&h=653

怎么改都不行,好像改左边的.leftNav ul li边距时,右下侧菜单会跟着改变同样的边距,字体样式如此。橙色字体菜单想改左边距为0(比如)、字号改为12px,怎么也改不了,问题在哪里???

请各位帮忙看下!

三克油。

代码如下:

/p>

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

测试页面

* {

margin: 0 auto;

padding: 0;

cursor: pointer;

}

a {

font-family:Microsoft YaHei,Simsun;

text-decoration:none;

}

.topNavContainer {

margin-top:121px;

width:100%;

height:42px;

border-top:1px solid;

border-bottom:1px solid;

}

.topNav {

border:1px solid;

width:977px;

height:42px;

position:relative;

}

.topNav a {

color:#444;

}

.topNav ul {

list-style:none;

}

.topNav ul li {

padding-right:40px;

font-size:14px;

line-height:42px;

float:left;

}

.tnavHighLight {

display:none;

position:absolute;

z-index:100009;

height:2px;

width:10%;

background-color:#f56400;

top:40px;

left:-6px;

}

.topNav ul li:hover .tnavHighLight {

display:block;

}

.leftNav {

position:relative;

top:0;

}

.leftNav ul {

left:-28px;

padding-top:10px;

list-style:none;

position:absolute;

z-index:10006;

display:none;

line-height:44px;

background-color:white;

border:1px solid;

height:400px;

}

.leftNav ul li {

clear:both;

background-color:white;

width:210px;

padding-right:0;

}

.leftNav ul li a {

font-size:14px;

padding-left:28px;

font-family:Microsoft YaHei,Simsun;

}

.topNav ul li:hover .leftNav ul{

display:block;

}

.leftNav ul li.active{

background-color:#feefe5;

}

.leftNav ul li:hover .active {

background-color:transparent;

}

.leftNav ul:hover li.active{

background-color:#fff;

}

.leftNav ul li:hover {

background-color:#feefe5 !important;

}

.rightNav {;

border:1px solid;

position:absolute;

width:820px;

height:400px;

top:0px;

left:210px;

padding-left:0;

padding-top:10px;

background-color:white;

display:none;

}

.rightNav dl {

float:left;

width:662px;

padding-left:0px;

border:1px solid;

}

.rightNav dd {

font-size:10px;

padding-left:0px;

}

.rightNav a {

float:left;

color:#f56400;

padding-right:0px;

padding-left:0px;

font-size:10px;

display:inline-block;

display:-moz-inline-stack;

}

.visible {

display:block;

}

.leftNav ul li:hover .rightNav {

display:block;

}

  • 顶菜单1
    • 左菜单1

      针织衫

      T恤

      毛衣

      衬衫

      半身裙

      长裙

      短裙

      风衣

      卫衣

      短外套

      夹克

      裤子

      西装

      大码女装

      妈妈装

      旗袍

      唐装

      休闲裤

      阔脚裤

      牛仔裤

      短裤

      打底衫

      打底裤

      吊带

      内衣

      皮衣

      皮草

      礼服

      舞台装

      套装

    • 左菜单2
      衣服2

      衣服2

      衣服2

      衣服2

      衣服2

  • 顶菜单2
    • 左菜单2-1
      衣服2-1

      衣服2-1

      衣服2-1

      衣服2-1

      衣服2-1

    • 左菜单2-2
      衣服2-2

      衣服2-2

      衣服2-2

      衣服2-2

      衣服2-2

这篇关于html设置内边距不改变大小,**css+html为什么右侧菜单的字体大小和边距设置在失效?谁能看下*...的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/389214

相关文章

CentOS和Ubuntu系统使用shell脚本创建用户和设置密码

《CentOS和Ubuntu系统使用shell脚本创建用户和设置密码》在Linux系统中,你可以使用useradd命令来创建新用户,使用echo和chpasswd命令来设置密码,本文写了一个shell... 在linux系统中,你可以使用useradd命令来创建新用户,使用echo和chpasswd命令来设

HTML5中的Microdata与历史记录管理详解

《HTML5中的Microdata与历史记录管理详解》Microdata作为HTML5新增的一个特性,它允许开发者在HTML文档中添加更多的语义信息,以便于搜索引擎和浏览器更好地理解页面内容,本文将探... 目录html5中的Mijscrodata与历史记录管理背景简介html5中的Microdata使用M

html5的响应式布局的方法示例详解

《html5的响应式布局的方法示例详解》:本文主要介绍了HTML5中使用媒体查询和Flexbox进行响应式布局的方法,简要介绍了CSSGrid布局的基础知识和如何实现自动换行的网格布局,详细内容请阅读本文,希望能对你有所帮助... 一 使用媒体查询响应式布局        使用的参数@media这是常用的

HTML5表格语法格式详解

《HTML5表格语法格式详解》在HTML语法中,表格主要通过table、tr和td3个标签构成,本文通过实例代码讲解HTML5表格语法格式,感兴趣的朋友一起看看吧... 目录一、表格1.表格语法格式2.表格属性 3.例子二、不规则表格1.跨行2.跨列3.例子一、表格在html语法中,表格主要通过< tab

Vue3组件中getCurrentInstance()获取App实例,但是返回null的解决方案

《Vue3组件中getCurrentInstance()获取App实例,但是返回null的解决方案》:本文主要介绍Vue3组件中getCurrentInstance()获取App实例,但是返回nu... 目录vue3组件中getCurrentInstajavascriptnce()获取App实例,但是返回n

JS+HTML实现在线图片水印添加工具

《JS+HTML实现在线图片水印添加工具》在社交媒体和内容创作日益频繁的今天,如何保护原创内容、展示品牌身份成了一个不得不面对的问题,本文将实现一个完全基于HTML+CSS构建的现代化图片水印在线工具... 目录概述功能亮点使用方法技术解析延伸思考运行效果项目源码下载总结概述在社交媒体和内容创作日益频繁的

前端CSS Grid 布局示例详解

《前端CSSGrid布局示例详解》CSSGrid是一种二维布局系统,可以同时控制行和列,相比Flex(一维布局),更适合用在整体页面布局或复杂模块结构中,:本文主要介绍前端CSSGri... 目录css Grid 布局详解(通俗易懂版)一、概述二、基础概念三、创建 Grid 容器四、定义网格行和列五、设置行

C#TextBox设置提示文本方式(SetHintText)

《C#TextBox设置提示文本方式(SetHintText)》:本文主要介绍C#TextBox设置提示文本方式(SetHintText),具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑... 目录C#TextBox设置提示文本效果展示核心代码总结C#TextBox设置提示文本效果展示核心代

前端下载文件时如何后端返回的文件流一些常见方法

《前端下载文件时如何后端返回的文件流一些常见方法》:本文主要介绍前端下载文件时如何后端返回的文件流一些常见方法,包括使用Blob和URL.createObjectURL创建下载链接,以及处理带有C... 目录1. 使用 Blob 和 URL.createObjectURL 创建下载链接例子:使用 Blob

Vuex Actions多参数传递的解决方案

《VuexActions多参数传递的解决方案》在Vuex中,actions的设计默认只支持单个参数传递,这有时会限制我们的使用场景,下面我将详细介绍几种处理多参数传递的解决方案,从基础到高级,... 目录一、对象封装法(推荐)二、参数解构法三、柯里化函数法四、Payload 工厂函数五、TypeScript