Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/file/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 固定侧边栏与响应垂直文本_Html_Css_Fixed_Sidebar_Vertical Text - Fatal编程技术网

Html 固定侧边栏与响应垂直文本

Html 固定侧边栏与响应垂直文本,html,css,fixed,sidebar,vertical-text,Html,Css,Fixed,Sidebar,Vertical Text,我想知道如何使我的左侧边栏位置固定,同时保持垂直文本按钮(关于、图库、联系人)响应窗口高度 我的网页的主要内容应该滚动,但侧边栏不应该 谢谢你的帮助 正文{ 保证金:0; } h1{ 文本对齐:居中; 字体大小:36px; } a{ 保证金:0px自动; -webkit转换:翻译(-50%,-50%); 转换:翻译(-50%,-50%); 位置:绝对位置; 最高:50%; 左:50%; 写入方式:tb-rl; 变换:translateX(-50%)translateY(-50%)旋转(-18

我想知道如何使我的左侧边栏位置固定,同时保持垂直文本按钮(关于、图库、联系人)响应窗口高度

我的网页的主要内容应该滚动,但侧边栏不应该

谢谢你的帮助

正文{
保证金:0;
}
h1{
文本对齐:居中;
字体大小:36px;
}
a{
保证金:0px自动;
-webkit转换:翻译(-50%,-50%);
转换:翻译(-50%,-50%);
位置:绝对位置;
最高:50%;
左:50%;
写入方式:tb-rl;
变换:translateX(-50%)translateY(-50%)旋转(-180度);
}
.导航1{
背景色:红色;
位置:相对位置;
高度:20vh;
宽度:10%;
}
.科{
浮动:对;
宽度:90%;
}

乱数假文。Lorem ipsum dolor sit amet,是一位杰出的献身者。这是先天性的。不,欧盟只是普尔维纳尔,精英车辆,爱神。在viverra id nisl,您的设备非常先进。Mauris酵母菌(Mauris felis luctus)是一种无菌发酵剂,它是一种无菌发酵剂。努克和坦普尔·利古拉。Donec fringilla malesuada mauris,我是faucibus urna。南普尔维纳尔、奥勒姆·帕特·康格、特普尔斯·特普尔斯·特普尔斯·特普尔斯、埃吉特·拉西尼亚·奥迪奥·萨皮恩·韦尔内克。门前前庭。Lorem ipsum dolor sit amet,是一位杰出的献身者。乱数假文。

您可以通过使用
位置:fixed
将导航包裹在div中轻松实现这一点。我已经修改了你的代码,下面我相信这是你想要的结果

有关css位置属性的更多信息,请访问

正文{
保证金:0;
}
h1{
文本对齐:居中;
字体大小:36px;
}
a{
保证金:0px自动;
-webkit转换:翻译(-50%,-50%);
转换:翻译(-50%,-50%);
位置:绝对位置;
最高:50%;
左:50%;
写入方式:tb-rl;
变换:translateX(-50%)translateY(-50%)旋转(-180度);
}
.导航1{
背景色:红色;
位置:相对位置;
高度:20vh;
//宽度:10%;这不再有效,因为它们包含在固定div中,
//但您可以将其添加到固定元素中以获得相同的外观
}
.固定{
位置:固定;
宽度:10%;
}
.科{
浮动:对;
宽度:90%;
}

乱数假文。Lorem ipsum dolor sit amet,是一位杰出的献身者。这是先天性的。不,欧盟只是普尔维纳尔,精英车辆,爱神。在viverra id nisl,您的设备非常先进。Mauris酵母菌(Mauris felis luctus)是一种无菌发酵剂,它是一种无菌发酵剂。努克和坦普尔·利古拉。Donec fringilla malesuada mauris,我是faucibus urna。南普尔维纳尔、奥勒姆·帕特·康格、特普尔斯·特普尔斯·特普尔斯·特普尔斯、埃吉特·拉西尼亚·奥迪奥·萨皮恩·韦尔内克。门前前庭。Lorem ipsum dolor sit amet,是一位杰出的献身者。乱数假文。

给出
位置:固定
开始。非常适合将项目“固定”到用户屏幕。固定元素,通常不去任何地方:-)

*{
字体系列:无衬线;
框大小:边框框
}
.侧边栏{
位置:固定;
排名:0;
左:0;
高度:100vh;
宽度:150px;
z指数:10;
背景:白色;
盒影:4px4px9pxRGBA(0,0,0,12)
}
.侧边栏跨距{
利润率:5%;
显示:块;
填充:50px0;
文本对齐:居中;
字体大小:20px;
变换:旋转(270度)
}
梅因先生{
左边距:170px;
溢出y:自动;
字体大小:50px;
线高:2
}

家
关于
接触
Lorem ipsum dolor sit amet,是一位杰出的献身者。Suspendisse ultrices ultrices libero ultrices饮食拍卖商。在奥迪奥阿库,奥特莱斯是一家维韦拉酒庄,麦格纳的索达尔酒庄。促性腺激素在无矢状节肢动物中的作用。无便利。埃尼安·比本杜姆·弗林西利亚。莫比·菲尼布斯,我是拉奥里特·福西布斯。但是,直径不超过10毫米。南马莱苏阿达奥奇和莫里斯乌尔特里斯威尼斯人。
产于蒙特斯的天然对虾和马格纳斯虎鲸(Orci varius natoque penatibus et magnis),以及印度虎鲸(nascetur ridiculus mus)。这是一个不平等的概念,是一个不平等的概念,是一个不平等的概念,是一个不平等的概念。整数级双盲双盲,非盲双盲双盲双盲双盲双盲双盲双盲双盲双盲双盲双盲双盲双盲双盲双盲双盲双盲。这是我的荣幸。阿利奎姆·内库利斯·埃拉特。在欧盟的封建主义者中,有两人被判死刑。千万别告诉我。他是个和蔼可亲的自由人。前庭前庭前庭前庭前庭前庭非前庭前庭。
非调味品拍卖商。马萨大酒店。Nam euismod,nisl非pulvinar congue,arcu arcu aliquet ex,et imperdiet neque ex eu sapien。在前庭Ultrices中,指的是丘脑托或丘脑托。这是马蒂斯的调味品。这是一个自由的例子。帕特·莫里斯。
Mauris finibus Predida elit,nec viverra odio。库拉索直径、高度元素、最大长度。前发酵菌。我的朋友们,我的朋友们。不可通俗地说。前庭舌苔,发酵液,酒香,智者。在hendrerit nisi maximus vitae,Maecenas imperdiet dapibus ante。阿利奎姆·埃拉特·帕特。门前辅助肌。阿利奎姆·埃拉特·帕特。
发酵液中的发酵液、发酵液和发酵液。无生命,无生命,无生命,无生命,无生命,无生命,无生命。前庭是一个舒适的地方。在ac neque EFFICTUR,placerat ante ut,tincidunt massa。Etiam eu FRINGILA精英。他是一个有尊严的人,也是一个有教养的人。整数euismod nulla sed libero ornare,位于justo lobortis车辆内。国际讲坛上的奎斯克,温和的迪亚姆,莫利斯·利伯罗。征服者康格·弗林尼利亚·奥奇,在阿利奎姆·萨吉提斯的作品中。玉米花粉蝶。我的天哪,我的天哪。莫布