<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>

<h4>css()</h4>
        <span>안녕</span><br />
        <button type="button" onclick="changeCssJs()">js로 바꾸기</button>
        <button type="button" onclick="changeCssJquery()">jquery로 바꾸기</button>
        <button type="button" onclick="getCssJquery()">jquery로 css 가져오기</button>
//css()

function changeCssJs() {
    let span = document.querySelector('span');
    span.style = 'font-size:20px; color:orange';
}
function changeCssJquery() {
    // $('span').css('font-size', '20px');
    // $('span').css('color', 'purple');
    //객체로 하나로 묶을 수 있음.
    $('span').css({ 'font-size': '40px', color: 'purple' });
}
function getCssJquery() {
    console.log($('span').css('color', 'red'));
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.