謂“腰椎間盤突出癥”是指“髓核”突破了“纖維環(huán)”的束縛,侵犯到“神經(jīng)”,導(dǎo)致神經(jīng)受到刺激或壓迫而引起的腰腿痛,疼痛常從腰背部放射至臀部、大腿、小腿、足趾等,就是我們常說的“坐骨神經(jīng)痛”。發(fā)病初期一般先選擇保守治療,如臥床休息,藥物治療等。但部分人保守治療并無效果,當(dāng)保守治療無效或者疼痛已經(jīng)影響到走路、睡眠、工作、生活時,常需要手術(shù)治療。手術(shù)治療也并不可怕,目前絕大部分腰椎間盤突出癥的患者可以采取微創(chuàng)手術(shù)治療,下面簡要介紹腰椎間盤突出癥的微創(chuàng)治療——內(nèi)鏡手術(shù)。
一、什么是腰椎間盤突出癥的微創(chuàng)內(nèi)鏡手術(shù)?
對于腰椎間盤突出癥來說,手術(shù)的目的是為了摘除突出的“髓核”,讓“神經(jīng)”不再受到壓迫和刺激。那么如何通過微創(chuàng)的方法達(dá)到這一目的呢?
首先,讓我了解一下罪魁禍?zhǔn)住巴怀龅乃韬恕蔽挥谌梭w的什么位置。髓核雖然已經(jīng)突出,但他仍藏在脊柱里面,看不見也摸不著;“突出的髓核”外面主要有三層結(jié)構(gòu)包圍,分別是皮膚、肌肉、骨骼,要摘除掉突出的髓核,需要經(jīng)過這三層結(jié)構(gòu)。
傳統(tǒng)開放手術(shù)就是采用最簡單的方法,一層一層切開,直到找到“突出的髓核”,然后將髓核摘除;就類似于洋蔥中間有只“害蟲”,我們需要一層一層剝開,才能找到這只“害蟲”。雖然最終摘除了髓核,但在切開剝離過程中會導(dǎo)致皮膚、肌肉、骨骼這三層結(jié)構(gòu)受到不同程度的損傷,恢復(fù)也就需要一定的時間。
而微創(chuàng)內(nèi)鏡手術(shù),就是借助內(nèi)鏡這一工具,在皮膚、肌肉、骨骼中鉆一個“小洞”,洞口在皮膚上,大小僅8毫米,洞的深面直接到達(dá)“突出的髓核”,然后在放大鏡和光源的幫助下摘除“突出的髓核”。同樣最終也摘除了髓核,但這種“打洞”的方法對皮膚、肌肉、骨骼這三層結(jié)構(gòu)損傷非常微小。
有些人會問“打洞”是不是需要挖出洞內(nèi)的部分肌肉和骨骼,這樣是不是也會導(dǎo)致肌肉、骨骼受到損傷呢?其實,這種“打洞”的方法并不是我們理解的在地里“鉆井挖洞”的方法,這種打洞是先采用一根細(xì)微的針(約1毫米),穿刺到“突出的髓核”位置,然后換成導(dǎo)絲(類似于一根導(dǎo)引線),接著沿著這根導(dǎo)絲,放入“口小身子大”的逐級擴張管道,每一級擴張?zhí)坠芏急壬弦患壌?毫米,最終放置約8毫米大小的管道;相當(dāng)于將本來僅有1毫米的“小洞”通過逐步撐開的方式擴大到8毫米大小,這種“逐步擴孔打洞”的方式對周圍的肌肉損傷可以忽略不計,因為富有彈性的肌肉是被鈍性撐開的,當(dāng)管道取出后,肌肉會自動閉合。
在放置好最后一級8毫米的管道之后,然后取出之前較小的管道,而僅保留最外層的那個8毫米的管道,這樣“打洞”的工作就完成了;然后外科醫(yī)生就在這個8毫米的“管道”里進(jìn)行工作,借助放大鏡和光源,把“突出的髓核”摘出來。最后取出這個8毫米的管道,肌肉會自動閉合;而皮膚上8毫米的切口,僅需縫合1針就可以閉合。
二、腰椎微創(chuàng)內(nèi)鏡手術(shù)——側(cè)路和后路有什么區(qū)別?
所謂“側(cè)路”和“后路”手術(shù),是指外科醫(yī)生“打洞”的位置在腰部的正后方還是側(cè)方。兩者沒有太大差別,主要根據(jù)突出髓核的位置和節(jié)段決定。其實髓核周圍包繞的骨骼并不是一堵圍墻,他還留有“兩扇門”,“一扇門”在后方,叫做椎板間隙),“另一扇門”在側(cè)方,叫做椎間孔,通過這“兩扇門”都可以到達(dá)髓核的位置,但在不同節(jié)段“兩扇門”的大小不一樣,外科醫(yī)生會選擇較大的“那扇門”進(jìn)入。一般來說,L4/5及以上的節(jié)段側(cè)方的“門”更大,常選擇”側(cè)路“內(nèi)鏡手術(shù);而L5/S1后方的“門”較大,常選擇“后路”內(nèi)鏡手術(shù)。但具體也要根據(jù)每個人的骨骼結(jié)構(gòu)和外科醫(yī)生經(jīng)驗進(jìn)行選擇。
三、對于腰椎間盤突出癥,采用微創(chuàng)內(nèi)鏡手術(shù)能根治或徹底嗎?
微創(chuàng)內(nèi)鏡手術(shù)可以達(dá)到根治“腰椎間盤突出癥”的目的,但需不需要做徹底手術(shù),需要根據(jù)病情的嚴(yán)重程度和病人自己的意愿來決定。對于“腰椎間盤突出癥”的治療可以選擇單純的“髓核摘除術(shù)”,和徹底的“腰椎融合術(shù)”。兩種手術(shù)都可以采用微創(chuàng)內(nèi)鏡完成,而兩者各有優(yōu)缺點。
采用微創(chuàng)內(nèi)鏡下“髓核摘除術(shù)”,是指借助內(nèi)鏡的方法,僅僅摘除突出的、壓迫神經(jīng)的那部分“髓核”,從而把神經(jīng)解救出來,但還繼續(xù)保留仍在纖維環(huán)內(nèi)的髓核,這樣髓核還能繼續(xù)發(fā)揮功能。這種方法創(chuàng)傷小,對自身組織破壞少,不需要鋼釘固定,是大部分“腰椎間盤突出癥”的首選治療。但這種方法的缺點在于:髓核將來可能再次突出,壓迫神經(jīng),再次突出的概率大約在5-15%左右。
采用“腰椎融合術(shù)”是一種徹底手術(shù),是指同時摘除突出的髓核以及還在纖維環(huán)內(nèi)的髓核,由于髓核被全部摘除,髓核的區(qū)域則采用骨質(zhì)進(jìn)行填充,為了維持穩(wěn)定,需要植入鋼釘(椎弓根螺釘)進(jìn)行固定。目前也可采用微創(chuàng)內(nèi)鏡方式進(jìn)行“腰椎融合術(shù)”,而這種手術(shù)除了需要一個摘除髓核的“小洞”之外,還需要其他“小洞”,用于植入螺釘。這種手術(shù)方式屬于徹底根治手術(shù),適合于腰椎間盤再次突出、合并有腰椎滑脫或嚴(yán)重椎管狹窄、椎間盤退變嚴(yán)重伴有椎間隙塌陷的患者。
四、腰椎微創(chuàng)內(nèi)鏡手術(shù)有什么優(yōu)勢?
采用微創(chuàng)內(nèi)鏡手術(shù)主要有以下三大優(yōu)勢:(1)手術(shù)創(chuàng)傷?。菏中g(shù)不會對身體造成太大損傷;(2)療效好:手術(shù)能摘除突出的髓核,從而解決疼痛問題;(3)恢復(fù)快:可以早期活動,不影響正常生活和工作。
其他優(yōu)勢還包括:(1)腰椎微創(chuàng)內(nèi)鏡手術(shù)可以選擇局部麻醉,這樣可以避免全麻手術(shù)的一些風(fēng)險,手術(shù)過程中還可以和醫(yī)生交流,手術(shù)前和手術(shù)后也不需要禁食禁水;(2)手術(shù)后第二天就可以回家,不需要長時間住院;(3)手術(shù)后第二天就可以下床活動,不需要長時間臥床;(4)傷口小,不用太擔(dān)心傷口發(fā)炎問題,待傷口閉合可早期洗浴。
作者簡介:石長貴,醫(yī)學(xué)博士,上海長征醫(yī)院骨科(脊柱微創(chuàng)中心)副主任醫(yī)師、副教授,擅長脊柱疾病的微創(chuàng)診治。專家門診時間:每周二下午、每周六上午。
圖片參考:[1]https://www.trialexhibitsinc.com/library-item/lumbar-disc-herniation-with-surgical-laminectomy-a; [2]https://weillcornellbrainandspine.org/condition/herniated-disc/surgery-herniated-disc;[3]https://precisionspinecare.com/educational_resources/index.html;
[3]https://musculoskeletalkey.com/posterior-lumbar-minimally-invasive-surgery/;
[4] https://www.epicpain.com/endoscopic-discectomy;
[5]https://link.springer.com/article/10.1186/s13018-018-0725-1;
[6]https://www.isjonline.com/article.asp?issn=2589-5079;year=2020;volume=3;issue=1;spage=66;epage=77;aulast=Lokhande;type=0;
[7]https://musculoskeletalkey.com/biomechanics-of-aging-spine/
在現(xiàn)代網(wǎng)頁設(shè)計中,個人主頁是一個展示個人信息、技能、事件等的重要載體。為了吸引訪客的注意力并提供良好的用戶體驗,設(shè)計師通常會運用各種技巧和效果來增加頁面的吸引力。本文將介紹如何使用CSS創(chuàng)建一個驚嘆的個人主頁介紹卡片,展示獨特魅力;
首先,需要定義基本的HTML結(jié)構(gòu)來容納個人主頁介紹卡片;
這里外層使用一個div包裹,里面使用三個<div>元素作為包裹容器布局,并在其中添加所需的圖像、內(nèi)容和按鈕等:
<div class="card">
<div class="box">
<div class="img_box">
<video
src="./assets/video.mp4"
muted
autoplay
loop
/>
</div>
</div>
<div class="box">
<div class="content">
<h2>
Alexa
<br>
<span>
Professional Artist
</span>
</h2>
<ul>
<li>
Posts
<span>22</span>
</li>
<li>
Followers
<span>999+</span>
</li>
<li>
Following
<span>7</span>
</li>
</ul>
<button>Follow</button>
</div>
</div>
<div class="circle">
<div class="img_box">
<img src="./assets/user.jpg" alt="">
</div>
</div>
</div>
外層是card容器,視頻和文本內(nèi)容區(qū)域是上下布局的,分別使用box容器包裹,最后是circle容器包裹頭像在定位在中間左邊超出;
注:
video設(shè)置屬性:靜音(muted)可實現(xiàn)自動播放(autoplay),接著設(shè)置循環(huán)播放(loop);
img>和video>的父容器是一個類名img_box;
接下來,我們將使用CSS來為個人主頁介紹卡片添加樣式。以下是一些關(guān)鍵的樣式屬性和技巧,可以使卡片看起來更加漂亮和吸引人;
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
:root {
--clr: #083d41
}
body {
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background-color: var(--clr);
}
.card {
background-color: var(--clr);
position: relative;
width: 320px;
height: 430px;
display: flex;
flex-direction: column;
justify-content: space-between;
}
/* 先把容器基本樣式調(diào)整一下 */
.card .box {
background-color: tomato;
position: relative;
width: 110%;
height: 200px;
/* 文本內(nèi)容區(qū)域圓角 */
border-radius: 20px;
}
/* 頭像容器則使用定位布局 */
.card .circle {
width: 180px;
height: 180px;
position: absolute;
left: -70px;
top: 50%;
transform: translateY(-50%);
border-radius: 50%;
border: 10px solid var(--clr);
}
/* 調(diào)整img和video共有的父容器樣式 */
.card .box .img_box,
.card .circle .img_box {
position: absolute;
inset: 0;
overflow: hidden;
/* img的圓角 */
border-radius: 50%;
}
.card .box .img_box {
/* video的圓角 */
border-radius: 15px;
}
/* 調(diào)整圖片和視頻的樣式 */
.card .box .img_box video,
.card .circle .img_box img {
position: absolute;
width: 100%;
height: 100%;
object-fit: cover;
}
調(diào)整card下的第一個box容器樣式,也就是包裹視頻的容器:
.card .box:nth-child(1)::before {
content: "";
width: 20px;
height: 20px;
background-color: transparent;
position: absolute;
z-index: 10;
top: 106px;
left: -1px;
border-bottom-left-radius: 20px;
box-shadow: -6px 6px var(--clr);
}
/* 樣式同before類似,注意定位樣式 */
.card .box:nth-child(1)::after {
content: "";
width: 20px;
height: 20px;
background-color: transparent;
position: absolute;
z-index: 10;
bottom: -1px;
left: 105px;
border-bottom-left-radius: 20px;
box-shadow: -6px 6px var(--clr);
}
目前添加樣式效果圖,可以在調(diào)試階段更改明顯色彩用于調(diào)整距離、位置等;
調(diào)整card下的第二個box容器樣式,也就是包含文字信息的容器:
.card .box:nth-child(2) {
background-color: #fff;
width: 100%;
height: 220px;
}
.card .box:nth-child(2)::before {
content: "";
width: 20px;
height: 20px;
background-color: transparent;
position: absolute;
z-index: 10;
bottom: 106px;
left: -1px;
border-top-left-radius: 20px;
box-shadow: -6px -6px var(--clr);
}
.card .box:nth-child(2)::after {
content: "";
width: 20px;
height: 20px;
background-color: transparent;
position: absolute;
z-index: 10;
top: -1px;
left: 109px;
border-top-left-radius: 20px;
box-shadow: -6px -6px var(--clr);
}
.card .box .content {
position: absolute;
inset: 0;
padding: 30px 10px 20px;
display: flex;
flex-direction: column;
align-items: center;
gap: 20px;
}
/* 姓名和Title樣式 */
.card .box .content h2 {
width: 100%;
padding-left: 120px;
text-transform: uppercase;
letter-spacing: 0.1em;
line-height: 1.1em;
font-size: 1.15em;
font-weight: 600;
color: #333;
}
.card .box .content h2 span {
letter-spacing: 0.05em;
font-size: 0.75em;
font-weight: 400;
color: tomato;
text-transform: initial;
}
/* 列表樣式 */
.card .box .content ul {
position: relative;
top: 15px;
width: 100%;
padding: 0 10px;
display: grid;
grid-template-columns: repeat(3, 1fr);
}
.card .box .content ul li {
list-style: none;
display: flex;
flex-direction: column;
align-items: center;
padding: 0 10px;
font-size: 0.85em;
font-weight: 500;
color: #999;
}
.card .box .content ul li:not(:last-child)
{
border-right: 1px solid #ccc;
}
.card .box .content ul li span{
font-size: 1.65em;
color: #333;
}
/* 按鈕樣式 */
.card .box .content button {
position: relative;
top: 25px;
padding: 8px 30px;
border: none;
outline: none;
background-color: #03a9f4;
border-radius: 30px;
color: #fff;
font-size: 1em;
letter-spacing: 0.2em;
text-transform: uppercase;
font-weight: 500;
cursor: pointer;
border: 5px solid var(--clr);
box-shadow: 0 0 0 10px #fff;
transition: .5s;
}
.card .box .content button:hover {
letter-spacing: 0.5em;
background-color: #ff3d7f;
}
由于按鈕的圓角與文本內(nèi)容卡片的交界處看上去顯得有些過于突兀了; 所以現(xiàn)在把它們的交界處優(yōu)化成弧形,樣式類似box的偽元素,這里也給按鈕創(chuàng)建兩個偽元素,用于優(yōu)化兩邊的交界處:
.card .box .content button::before {
content: "";
width: 20px;
height: 20px;
background-color: transparent;
position: absolute;
top: 23px;
left: -29px;
border-top-right-radius: 20px;
box-shadow: 5px -7px #fff;
}
.card .box .content button::after {
content: "";
width: 20px;
height: 20px;
background-color: transparent;
position: absolute;
top: 23px;
right: -29px;
border-top-left-radius: 20px;
box-shadow: -5px -7px #fff;
}
除了基本樣式之外,還進(jìn)一步優(yōu)化個人主頁介紹卡片的細(xì)節(jié)。一些可選的技巧包括:
通過運用CSS的各種樣式屬性和技巧,我們可以輕松地創(chuàng)建漂亮的個人主頁介紹卡片。這些卡片不僅能夠有效地展示個人信息和技能,還能夠吸引訪客的注意力并提供良好的用戶體驗。記得嘗試不同的樣式和效果來定制你自己獨特的個人主頁卡片!
CSS創(chuàng)作個人主頁介紹卡片,展示獨特魅力
原文鏈接:https://juejin.cn/post/7260709771870060603
HTML (Hypertext Markup Language)是標(biāo)準(zhǔn)標(biāo)記語言,是 Web 瀏覽器顯示的基礎(chǔ)。 此外,CSS(Cascading Style Sheets)等技術(shù)以及JavaScript等腳本語言也支持這種技術(shù)。
創(chuàng)建主頁時,首先使用 HTML 確定句子的結(jié)構(gòu)并標(biāo)記它,然后設(shè)計要顯示的信息。 這是網(wǎng)頁的基礎(chǔ)。
現(xiàn)在,讓我們仔細(xì)看看可以使用少量 CSS 代碼實現(xiàn)的技術(shù)。
Web 性能改進(jìn)技術(shù)之一是屬性,允許用戶延遲加載,直到滾動。 它還適用于嵌入 YouTube 視頻的 iframe 代碼和大尺寸圖像。loading="lazy"
XHTML
1 | <img src='image.jpg' loading='lazy' alt='代替テキスト'> |
打開電子郵件創(chuàng)建頁面、直接撥打電話或發(fā)送短消息的技術(shù)。
XHTML
1 2 3 4 5 6 7 8 9 10 11 | <a href="mailto:{email}?subject={subject}&body={content}"> Eメールを送信 </a> <a href="tel:{phone}"> お電話ください </a> <a href="sms:{phone}?body={content}"> SMSショートメッセージを送信 </a> |
start屬性允許您自由確定列表格式的數(shù)字。
meter元素允許您使用彩色滑塊顯示數(shù)字和數(shù)量。 不需要 JavaScript 或 CSS。
通過預(yù)先在表單輸入元素中指定一些數(shù)據(jù)列表,可以將其作為候選關(guān)鍵字顯示在輸入字段中的下拉列表中。
fieldset元素允許您將 Web 窗體中的多個控件和標(biāo)簽 () 組合在一起。label
target="_blank在 中打開的頁面將允許您訪問原始頁面的 window.opener。 這可能會對安全性和性能產(chǎn)生負(fù)面影響,例如"原始窗口在知道之前已轉(zhuǎn)換到填充站點"。 為了防止這種情況,請包括 或 。rel="noopener"rel="noreferrer"
1 2 3 | <a href="https://markodenic.com/" target="_blank" rel="noopener"> 參考ウェブサイト </a> |
如果要在新選項卡中打開 HTML 文檔中的所有鏈接,可以使用元素。 在下面的示例中,兩個鏈接都在新的選項卡中打開。base
若要更新網(wǎng)站的傳真,您可以通過將其添加到文件名中來在瀏覽器中下載新版本。?v=2
一種有效的技術(shù),尤其是在生產(chǎn)環(huán)境中,以確保用戶輸入新版本。
XHTML
1 | <link rel="icon" href="/favicon.ico?v=2" /> |
可以決定是否檢查元素的拼寫錯誤的屬性。spellcheck
input type="range"允許您使用滑塊調(diào)整數(shù)字。 所選數(shù)字可以顯示在 中。input type="number"
details元素允許您創(chuàng)建僅 HTML 本機手風(fēng)琴。
mark標(biāo)記允許您使用黃色標(biāo)記突出顯示文本的一部分。
URL 鏈接的屬性允許您直接下載文件,而不是將其移動到文件中。download
XHTML
1 2 3 | <a href='path/to/file' download> Download </a> |
使用".webp"作為圖像格式可以減小圖像大小并提高網(wǎng)站性能。
XHTML
1 2 3 4 5 6 7 8 9 10 11 | <picture> <!-- サポートされていたら.webp畫像を読み込む --> <source srcset="logo.webp" type="image/webp"> <!-- .webp畫像や<picture>タグが ブラウザにサポートされていないときの フォールバックとして --> <img src="logo.png" alt="logo"> </picture> |
poster屬性允許您指定在加載視頻或按下"播放"按鈕之前顯示的圖像。
XHTML
1 | <video poster="path/to/image"> |
在搜索框中使用時,將自動顯示"X"清除標(biāo)記以取消。type="search"
只有 HTML 可以實現(xiàn)的功能,我有很多。 我們計劃在未來添加和更新小技巧技術(shù)。
*請認(rèn)真填寫需求信息,我們會在24小時內(nèi)與您取得聯(lián)系。