Как изменить текст при наведении css

<p class="change-text">Lorem Ipsum</p>
      

p.change-text{
  color: #f66d52; /* Цвет текста */
  font-size: 2em; /* Размер текста */
  font-weight: bold;
  padding: 20px 0px;
  text-transform: uppercase;
  line-height: 1;
  -webkit-transition: all 0.5s ease;
          transition: all 0.5s ease; 
}
p.change-text:hover{
  color: #5265f6; /* Меняем цвет текста */
}
     

<p class="line-through">Lorem Ipsum</p>
      

p.line-through{
  color: #f66d52; /* Цвет текста */
  font-weight: 400;
  text-transform: uppercase;
  font-size: 1em;
  text-decoration:none; 
}
p.line-through:hover{
  text-decoration:line-through; /* Добавляем зачеркивание */
}
     

<!— Ссылка —>

<!— Текст —>

Lorem Ipsum

<!-- Ссылка -->
<div class="crossed"><a href="#" class="crossed-link" title="">Lorem Ipsum</a></div>
<!-- Текст -->
<div class="crossed"><p class="crossed-text">Lorem Ipsum</p></div>
      

/* Ссылка */
a.crossed-link {
  color: #f66d52; /* Цвет сылки */
  font-weight: 400;
  text-transform: uppercase;
  text-decoration: none;
  font-size: 1em;
  position: relative;
  display: inline-block;
}
a.crossed-link:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 1px; /* Высота зачеркивающей линии */
  background: #666; /* Цвет зачеркивающей линии */
  top: 45%;
  animation: out 0s cubic-bezier(1, 0, 0.58, 0.97) 1 both;
}
div.crossed:hover a.crossed-link:before {
  animation: in 0.2s cubic-bezier(1, 0, 0.58, 0.97) 1 both;
}

/* Текст */
p.crossed-text{
  color: #ffa000; /* Цвет текста */
  font-weight: 400;
  text-transform: uppercase;
  font-size: 1em;
  position: relative;
  display: inline-block;
}
p.crossed-text:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 1px; /* Высота зачеркивающей линии */
  background: #666; /* Цвет зачеркивающей линии */
  top: 45%;
  animation: out 0s cubic-bezier(1, 0, 0.58, 0.97) 1 both;
}
div.crossed:hover p.crossed-text:before {
  animation: in 0.2s cubic-bezier(1, 0, 0.58, 0.97) 1 both;
}

/* Анимация */
@keyframes in {
  0% {
  width: 0;
  left: 0;
  right: auto;
  }
  100% {
  left: 0;
  right: auto;
  width: 100%;
  }
}
@keyframes out {
  0% {
  width: 100%;
  left: auto;
  right: 0;
  }
  100% {
  width: 0;
  left: auto;
  right: 0;
  }
}
@keyframes show {
  0% {
  opacity: 0;
  transform: translateY(-10px);
  }
  100% {
  opacity: 1;
  transform: translateY(0);
  }
}
     

<p class="shadow-text">Lorem Ipsum</p>
      

.shadow-text{
  color: #f66d52; /* Цвет  текста */
  font-size: 2em; /* Размер  текста */
  font-weight: bold;
  padding: 20px 0px;
  text-transform: uppercase;
  line-height: 1;
  -webkit-transition: all 0.5s ease;
          transition: all 0.5s ease;
}
.shadow-text:hover{
  color: #ffa000; /* Меняем цвет текста */
  -webkit-text-shadow: 2px 2px 2px #000;
  -moz-text-shadow: 2px 2px 2px #000;
      text-shadow: 2px 2px 2px #000;
}
     

<a href="#" class="underline-one">Lorem Ipsum</a>
      

.underline-one {
	color: #00bfff; /* Цвет обычной ссылки */
    position: relative;
    cursor: pointer;
    text-decoration: none; /* Убираем подчеркивание */
}
.underline-one:after {
	content: "";
    display: block;
    position: absolute;
    right: 0;
    bottom: -3px;
    width: 0;
    height: 2px; /* Высота линии */
    background-color: black; /* Цвет подчеркивания при исчезании линии*/
    transition: width 0.5s; /* Время эффекта */
}

.underline-one:hover:after {
	content: "";
    width: 100%;
    display: block;
    position: absolute;
    left: 0;
    bottom: -3px;
    height: 2px; /* Высота линии */
    background-color: red; /* Цвет подчеркивания при появлении линии*/
    transition: width 0.5s;  /* Время эффекта */
}
     

<div class="link-ease-in-out">
    <a href="#" title="Lorem Ipsum">Lorem Ipsum</a>
</div>
      

.link-ease-in-out a {
    display: inline-block;
    color: #00bfff; /* Цвет обычной ссылки */
    line-height: 1;
    text-decoration: none; /* Убираем подчеркивание */
    cursor: pointer;
}
.link-ease-in-out a:after {
    background-color: #f66d52; /* Цвет линии при наведении на нее курсора мыши */
    display: block;
    content: "";
    height: 2px; /* Высота линии */
    width: 0%;
    -webkit-transition: width .3s ease-in-out;
    -moz--transition: width .3s ease-in-out;
    transition: width .3s ease-in-out;
}
.link-ease-in-out a:hover:after,
.link-ease-in-out a:focus:after {
    width: 100%;
}
     

p {
    color: #5a5a5a; /* Цвет текста */
    background: #ffc; /* Цвет фона */
    padding: 10px; /* Поля вокруг текста */
    transition: 1s linear; /* Время изменения */
}
p:hover {
    color: #fff; /* Цвет текста */
    background: #f66d52; /* Цвет фона */
}
     

Lorem Ipsum

Lorem Ipsum

Lorem Ipsum

<p class="gain-left">Lorem Ipsum</p>
<p class="gain-center">Lorem Ipsum</p>
<p class="gain-right">Lorem Ipsum</p>
      

/* Текст слева */
.gain-left {
  transition: 1s; /* Время эффекта */
  text-align: left; 
}
.gain-left:hover {
  transform: scale(1.2); /* Увеличиваем масштаб */
}
/* Текст по центру */
.gain-center{
  transition: 1s; /* Время эффекта */
  text-align: center; 
}
.gain-center:hover {
  transform: scale(1.2); /* Увеличиваем масштаб */
}
/* Текст справа */
.gain-right {
  transition: 1s; /* Время эффекта */
  text-align: right; 
}
.gain-right:hover {
  transform: scale(1.2); /* Увеличиваем масштаб */
}
     

<h3 class="title-example">Lorem Ipsum</h3>
      

h3.title-example{
    font-size: 1em; /* Размер шрифта */
    color: #5a5a5a; /* Цвет заголовка */
    text-align: center; /* Текст по центру */
}
/*  CSS код для линии над заголовком */
h3.title-example:before {
    content: '';
    display: block;
    height: 1px; /* Высота линии */
    background: #f66d52; /* Цвет линии */
    width: 150px; /* Ширина линии до наведения */
    margin: 0 auto 10px; /* Отступ с боков по центру и снизу */
	transition: 1s; /* Время, за которое линия возвращается после наведения */
}
h3.title-example:hover:before {
    width: 250px; /* Ширина линии при наведении */
	transition: ease-out 1s; /* Время, за которое линия расширяется при наведении */
}
/*  CSS код для линии под заголовком */
h3.title-example:after {
    content: '';
    display: block;
    height: 1px; /* Высота линии */
    background: #f66d52; /* Цвет линии */
    width: 150px; /* Ширина линии до наведения */
    margin: 10px auto 0; /* Отступ с боков по центру и сверху */
	transition: 1s; /* Время, за которое линия возвращается после наведения */
}
h3.title-example:hover:after {
    width: 250px; /* Ширина линии при наведении */
	transition: ease-out 1s; /* Время, за которое линия расширяется при наведении */
}