background: -webkit-linear-gradient(bottom, #87C03B, #98D647);background-image: -webkit-linear-gradient(bottom, #87C03B, #98D647);.product-frame:hover * {
opacity: 0.7;
}.thumbnail-container {opacity:1}
.content-description {opacity:1}<header class="page-header">
<div class="logo page-header__logo">
...
</div>
<nav class="menu page-header__navigation">
...
</nav>
<ul class="page-header__social social-list">
...
</ul>
</header><svg>
<defs>
<linearGradient id='myGradient'>
<stop offset='0%' stop-color='red'></stop>
<stop offset='100%' stop-color='blue'></stop>
</linearGradient>
</defs>
<circle cx='100' cy='100' r='50' fill='url(#myGradient)' />
</svg>...
<head>
<link href="css/common.css" rel="stylesheet">
<?php if($user['color_scheme']): ?>
<link id="themelink" href="css/<?=$user['color_scheme']?>.css" rel="stylesheet">
<?php else: ?>
<link href="css/default.css" rel="stylesheet">
<?php endif; ?>
</head>
...
<input type="radio" value="theme1" name="theme">
<input type="radio" value="theme2" name="theme">var themelink = $('#themelink')
$('input[name="theme"]').on('change', function(){
var theme = this.value;
themelink.attr('href', 'css/'+theme+'.css');
$.post('/some/server/path',{theme:theme}).then(function(response){
console.log('theme has been changed');
})
});